use fragments

Signed-off-by: Ruslan Bayandinov <wazsone@ya.ru>
hcengineering · May 22, 2023 · 0e7c7d9 · 0e7c7d9
1 parent 9cc2d27
commit 0e7c7d9
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 41 deletions.
diff --git a/models/tracker/src/index.ts b/models/tracker/src/index.ts
@@ -1027,7 +1027,14 @@ export function createModel (builder: Builder): void {
             position: 'top',
             label: tracker.string.MyIssues,
             icon: tracker.icon.MyIssues,
-            component: tracker.component.MyIssues
+            component: tracker.component.MyIssues,
+            componentProps: {
+              config: [
+                ['assigned', tracker.string.Assigned, {}],
+                ['created', tracker.string.Created, { value: 2 }],
+                ['subscribed', tracker.string.Subscribed, {}]
+              ]
+            }
           },
           {
             id: allIssuesId,
@@ -1038,7 +1045,12 @@ export function createModel (builder: Builder): void {
             componentProps: {
               baseQuery: { '$lookup.space.archived': false },
               space: undefined,
-              title: tracker.string.AllIssues
+              title: tracker.string.AllIssues,
+              config: [
+                ['all', tracker.string.All, {}],
+                ['active', tracker.string.Active, {}],
+                ['backlog', tracker.string.Backlog, {}]
+              ]
             }
           }
         ],
@@ -1056,7 +1068,12 @@ export function createModel (builder: Builder): void {
                 icon: tracker.icon.Issues,
                 component: tracker.component.Issues,
                 componentProps: {
-                  title: tracker.string.Issues
+                  title: tracker.string.Issues,
+                  config: [
+                    ['all', tracker.string.All, {}],
+                    ['active', tracker.string.Active, {}],
+                    ['backlog', tracker.string.Backlog, {}]
+                  ]
                 }
               },
               {

diff --git a/plugins/tracker-resources/src/components/issues/Issues.svelte b/plugins/tracker-resources/src/components/issues/Issues.svelte
@@ -13,26 +13,23 @@
 // limitations under the License.
 -->
 <script lang="ts">
+  import { createEventDispatcher, onMount } from 'svelte'
   import { DocumentQuery, Ref } from '@hcengineering/core'
   import { Issue, Project } from '@hcengineering/tracker'
-  import tracker from '../../plugin'
-  import IssuesView from './IssuesView.svelte'
   import { IntlString } from '@hcengineering/platform'
   import { createQuery } from '@hcengineering/presentation'
+
+  import tracker from '../../plugin'
   import { IModeSelector } from '../../utils'
-  import { navigate, parseLocation } from '@hcengineering/ui'
+  import IssuesView from './IssuesView.svelte'
 
   export let currentSpace: Ref<Project> | undefined = undefined
   export let baseQuery: DocumentQuery<Issue> = {}
   export let title: IntlString
+  export let config: [string, IntlString, object][]
 
-  const config: [string, IntlString, object][] = [
-    ['all', tracker.string.All, {}],
-    ['active', tracker.string.Active, {}],
-    ['backlog', tracker.string.Backlog, {}]
-  ]
-  let [[mode]] = config
-  const loc = parseLocation(new URL(`${window.location.href}/${mode}`))
+  const dispatch = createEventDispatcher()
+  let mode: string
 
   $: spaceQuery = currentSpace ? { space: currentSpace } : {}
 
@@ -69,14 +66,15 @@
   function getQuery (mode: string, queries: { [key: string]: DocumentQuery<Issue> }) {
     return { ...queries[mode], '$lookup.space.archived': false }
   }
+
   $: query = getQuery(mode, { all, active, backlog })
   $: modeSelectorProps = {
     config,
     mode,
     onChange: handleChangeMode
   } as IModeSelector
-  $: loc.path[loc.path.length - 1] = mode
-  $: navigate(loc)
+  $: dispatch('action', mode)
+  onMount(() => ([[mode]] = config))
 </script>
 
 {#key query && currentSpace}

diff --git a/plugins/tracker-resources/src/components/myissues/MyIssues.svelte b/plugins/tracker-resources/src/components/myissues/MyIssues.svelte
@@ -13,28 +13,25 @@
 // limitations under the License.
 -->
 <script lang="ts">
+  import { createEventDispatcher, onMount } from 'svelte'
   import type { EmployeeAccount } from '@hcengineering/contact'
   import { Doc, DocumentQuery, getCurrentAccount, Ref } from '@hcengineering/core'
   import type { IntlString } from '@hcengineering/platform'
   import { createQuery } from '@hcengineering/presentation'
   import type { Issue } from '@hcengineering/tracker'
 
-  import tracker from '../../plugin'
   import IssuesView from '../issues/IssuesView.svelte'
+  import tracker from '../../plugin'
   import { IModeSelector } from '../../utils'
-  import { navigate, parseLocation } from '@hcengineering/ui'
 
-  const config: [string, IntlString, object][] = [
-    ['assigned', tracker.string.Assigned, {}],
-    ['created', tracker.string.Created, { value: 2 }],
-    ['subscribed', tracker.string.Subscribed, {}]
-  ]
+  export let config: [string, IntlString, object][] = []
+
+  const dispatch = createEventDispatcher()
   const currentUser = getCurrentAccount() as EmployeeAccount
   const assigned = { assignee: currentUser.employee }
   const created = { createdBy: currentUser._id }
   let subscribed = { _id: { $in: [] as Ref<Issue>[] } }
-  let [[mode]] = config
-  const loc = parseLocation(new URL(`${window.location.href}/${mode}`))
+  let mode: string
 
   const subscribedQuery = createQuery()
   $: subscribedQuery.query(
@@ -64,8 +61,8 @@
     mode,
     onChange: handleChangeMode
   } as IModeSelector
-  $: loc.path[loc.path.length - 1] = mode
-  $: navigate(loc)
+  $: dispatch('action', mode)
+  onMount(() => ([[mode]] = config))
 </script>
 
 <IssuesView {query} space={undefined} title={tracker.string.MyIssues} {modeSelectorProps} />
diff --git a/plugins/workbench-resources/src/components/Workbench.svelte b/plugins/workbench-resources/src/components/Workbench.svelte
@@ -39,6 +39,7 @@
     closePopup,
     closeTooltip,
     deviceOptionsStore as deviceInfo,
+    getCurrentLocation,
     location,
     navigate,
     openPanel,
@@ -584,21 +585,6 @@
             selected={currentAppAlias === notificationId || inboxPopup !== undefined}
             on:click={(e) => {
               if (e.metaKey || e.ctrlKey) return
-              // if (inboxPopup) {
-              //   inboxPopup.close()
-              // } else {
-              //   inboxPopup = showPopup(
-              //     notification.component.Inbox,
-              //     { visibileNav: true },
-              //     'content',
-              //     undefined,
-              //     undefined,
-              //     {
-              //       category: 'popup',
-              //       overlay: false
-              //     }
-              //   )
-              // }
               if (currentAppAlias === notificationId && lastLoc !== undefined) {
                 e.preventDefault()
                 e.stopPropagation()
@@ -689,6 +675,13 @@
           <Component
             is={specialComponent.component}
             props={{ model: navigatorModel, ...specialComponent.componentProps, currentSpace, visibileNav }}
+            on:action={(e) => {
+              if (e?.detail) {
+                const loc = getCurrentLocation()
+                loc.fragment = e.detail
+                navigate(loc)
+              }
+            }}
           />
         {:else if currentView?.component !== undefined}
           <Component is={currentView.component} props={{ ...currentView.componentProps, currentView, visibileNav }} />