Fix disabled integration notification (#2962)

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

models/setting/package.json

@@ -37,6 +37,7 @@
     "@hcengineering/model-view": "^0.6.0",
     "@hcengineering/model-workbench": "^0.6.1",
     "@hcengineering/task": "^0.6.4",
+    "@hcengineering/notification": "^0.6.9",
     "@hcengineering/templates": "^0.6.1",
     "@hcengineering/activity": "^0.6.0"
   }

models/setting/src/index.ts

@@ -33,6 +33,7 @@ import task from '@hcengineering/task'
 import setting from './plugin'
 import templates from '@hcengineering/templates'
 import contact from '@hcengineering/contact'
+import notification from '@hcengineering/notification'
 
 import workbench from '@hcengineering/model-workbench'
 import { AnyComponent } from '@hcengineering/ui'
@@ -101,6 +102,14 @@ export function createModel (builder: Builder): void {
     TInviteSettings
   )
 
+  builder.mixin(setting.class.Integration, core.class.Class, notification.mixin.ClassCollaborators, {
+    fields: ['modifiedBy']
+  })
+
+  builder.mixin(setting.class.Integration, core.class.Class, view.mixin.ObjectPanel, {
+    component: setting.component.IntegrationPanel
+  })
+
   builder.createDoc(
     setting.class.SettingsCategory,
     core.space.Model,
@@ -293,8 +302,7 @@ export function createModel (builder: Builder): void {
       txClass: core.class.TxUpdateDoc,
       label: setting.string.IntegrationWith,
       labelComponent: setting.activity.TxIntegrationDisable,
-      component: setting.activity.TxIntegrationDisableReconnect,
-      display: 'emphasized',
+      display: 'inline',
       editable: false,
       hideOnRemove: true
     },

models/setting/src/plugin.ts

@@ -24,8 +24,7 @@ import { TemplateFieldFunc } from '@hcengineering/templates'
 
 export default mergeIds(settingId, setting, {
   activity: {
-    TxIntegrationDisable: '' as AnyComponent,
-    TxIntegrationDisableReconnect: '' as AnyComponent
+    TxIntegrationDisable: '' as AnyComponent
   },
   ids: {
     TxIntegrationDisable: '' as Ref<TxViewlet>,
@@ -43,7 +42,8 @@ export default mergeIds(settingId, setting, {
     Owners: '' as AnyComponent,
     CreateMixin: '' as AnyComponent,
     InviteSetting: '' as AnyComponent,
-    ArrayEditor: '' as AnyComponent
+    ArrayEditor: '' as AnyComponent,
+    IntegrationPanel: '' as AnyComponent
   },
   category: {
     Settings: '' as Ref<ActionCategory>

plugins/setting-resources/package.json

@@ -40,6 +40,7 @@
     "@hcengineering/attachment": "^0.6.3",
     "@hcengineering/ui": "^0.6.5",
     "@hcengineering/presentation": "^0.6.2",
+    "@hcengineering/panel": "^0.6.3",
     "@hcengineering/view": "^0.6.3",
     "@hcengineering/view-resources": "^0.6.0",
     "@hcengineering/task": "^0.6.4",

plugins/setting-resources/src/components/IntegrationPanel.svelte

@@ -0,0 +1,72 @@
+<!--
+// Copyright © 2023 Hardcore Engineering Inc.
+//
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//
+// See the License for the specific language governing permissions and
+// limitations under the License.
+-->
+<script lang="ts">
+  import { Class, Ref } from '@hcengineering/core'
+  import { Panel } from '@hcengineering/panel'
+  import { createQuery } from '@hcengineering/presentation'
+  import { Integration, IntegrationType } from '@hcengineering/setting'
+  import setting from '../plugin'
+  import PluginCard from './PluginCard.svelte'
+  import { translate } from '@hcengineering/platform'
+
+  export let _id: Ref<Integration>
+  export let _class: Ref<Class<Integration>>
+  export let embedded = false
+
+  let integration: Integration | undefined = undefined
+  const query = createQuery()
+
+  $: query.query(
+    setting.class.Integration,
+    {
+      _id
+    },
+    (res) => ([integration] = res)
+  )
+
+  let type: IntegrationType | undefined = undefined
+  const typeQuery = createQuery()
+
+  $: integration &&
+    typeQuery.query(
+      setting.class.IntegrationType,
+      {
+        _id: integration.type
+      },
+      (res) => ([type] = res)
+    )
+
+  let title: string = ''
+  translate(setting.string.Integrations, {}).then((res) => (title = res))
+</script>
+
+{#if integration}
+  <Panel
+    icon={setting.icon.Integrations}
+    {title}
+    object={integration}
+    {embedded}
+    isHeader={false}
+    isAside={false}
+    withoutActivity
+    withoutInput
+  >
+    <div class="max-w-80 min-w-80">
+      {#if type}
+        <PluginCard {integration} integrationType={type} />
+      {/if}
+    </div>
+  </Panel>
+{/if}

plugins/setting-resources/src/components/activity/TxIntegrationDisableReconnect.svelte

@@ -1,54 +0,0 @@
-<!--
-// Copyright © 2022 Hardcore Engineering Inc.
-//
-// Licensed under the Eclipse Public License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License. You may
-// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-//
-// See the License for the specific language governing permissions and
-// limitations under the License.
--->
-<script lang="ts">
-  import { TxUpdateDoc } from '@hcengineering/core'
-  import { getClient } from '@hcengineering/presentation'
-  import { Integration, IntegrationType } from '@hcengineering/setting'
-  import { Button, eventToHTMLElement, showPopup } from '@hcengineering/ui'
-  import setting from '../../plugin'
-
-  export let tx: TxUpdateDoc<Integration>
-  let doc: Integration | undefined
-
-  const client = getClient()
-
-  let type: IntegrationType | undefined
-
-  $: getType(tx)
-
-  async function getType (tx: TxUpdateDoc<Integration>): Promise<IntegrationType | undefined> {
-    doc = await client.findOne(setting.class.Integration, { _id: tx.objectId })
-    if (doc === undefined) return
-    type = await client.findOne(setting.class.IntegrationType, { _id: doc.type })
-  }
-
-  async function reconnect (res: any): Promise<void> {
-    if (res?.value) {
-      if (doc === undefined) return
-      await client.update(doc, {
-        disabled: false
-      })
-    }
-  }
-  const handleReconnect = (e: MouseEvent) => {
-    if (type?.reconnectComponent) {
-      showPopup(type.reconnectComponent, {}, eventToHTMLElement(e), reconnect)
-    }
-  }
-</script>
-
-<div class="flex-center">
-  <Button label={setting.string.Reconnect} kind={'primary'} on:click={handleReconnect} />
-</div>

plugins/setting-resources/src/index.ts

@@ -19,7 +19,6 @@ import { getClient, MessageBox } from '@hcengineering/presentation'
 import { showPopup } from '@hcengineering/ui'
 import { deleteObject } from '@hcengineering/view-resources/src/utils'
 import TxIntegrationDisable from './components/activity/TxIntegrationDisable.svelte'
-import TxIntegrationDisableReconnect from './components/activity/TxIntegrationDisableReconnect.svelte'
 import ClassSetting from './components/ClassSetting.svelte'
 import CreateMixin from './components/CreateMixin.svelte'
 import EditEnum from './components/EditEnum.svelte'
@@ -44,6 +43,7 @@ import StringTypeEditor from './components/typeEditors/StringTypeEditor.svelte'
 import WorkspaceSettings from './components/WorkspaceSettings.svelte'
 import InviteSetting from './components/InviteSetting.svelte'
 import setting from './plugin'
+import IntegrationPanel from './components/IntegrationPanel.svelte'
 import { getOwnerName, getOwnerPosition, getValue } from './utils'
 
 export { ClassSetting }
@@ -72,8 +72,7 @@ async function DeleteMixin (object: Mixin<Class<Doc>>): Promise<void> {
 
 export default async (): Promise<Resources> => ({
   activity: {
-    TxIntegrationDisable,
-    TxIntegrationDisableReconnect
+    TxIntegrationDisable
   },
   component: {
     Settings,
@@ -98,7 +97,8 @@ export default async (): Promise<Resources> => ({
     EnumSetting,
     Owners,
     CreateMixin,
-    InviteSetting
+    InviteSetting,
+    IntegrationPanel
   },
   actionImpl: {
     DeleteMixin