platform/plugins/tracker-resources/src/components/issues/IssueStatusIcon.svelte
Andrey Sobolev ef987eef56
TSK-1323: Fix colors for list (#3069)
Signed-off-by: Andrey Sobolev <haiodo@gmail.com>
2023-04-25 23:11:50 +07:00

82 lines
2.9 KiB
Svelte

<!--
// 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 core, { StatusCategory, WithLookup } from '@hcengineering/core'
import { createQuery, getClient, statusStore } from '@hcengineering/presentation'
import { IssueStatus } from '@hcengineering/tracker'
import { IconSize, getPlatformColor } from '@hcengineering/ui'
import tracker from '../../plugin'
import StatusIcon from '../icons/StatusIcon.svelte'
export let value: WithLookup<IssueStatus>
export let size: IconSize
export let fill: string | undefined = undefined
const dynamicFillCategories = [tracker.issueStatusCategory.Started]
const client = getClient()
let category: StatusCategory | undefined
let statuses: IssueStatus[] = []
const statusIcon: {
index: number | undefined
count: number | undefined
} = { index: undefined, count: undefined }
const categoriesQuery = createQuery()
$: if (value.category === tracker.issueStatusCategory.Started) {
const _s = [
...$statusStore.filter(
(it) => it.ofAttribute === value.ofAttribute && it.category === tracker.issueStatusCategory.Started
)
]
_s.sort((a, b) => a.rank.localeCompare(b.rank))
statuses = _s
categoriesQuery.unsubscribe()
}
async function updateCategory (status: WithLookup<IssueStatus>, statuses: IssueStatus[]) {
if (status.$lookup?.category) {
category = status.$lookup.category
}
if (category === undefined) {
category = await client.findOne(core.class.StatusCategory, { _id: value.category })
}
if (value.category !== undefined && dynamicFillCategories.includes(value.category)) {
const index = statuses.findIndex((p) => p._id === value._id)
if (index !== -1) {
statusIcon.index = index + 1
statusIcon.count = statuses.length + 1
} else {
statusIcon.index = undefined
statusIcon.count = undefined
}
}
}
$: updateCategory(value, statuses)
$: icon = category?.icon
$: color =
fill ??
(value.color !== undefined ? getPlatformColor(value.color) : undefined) ??
(category !== undefined ? getPlatformColor(category.color) : undefined) ??
'currentColor'
</script>
{#if icon !== undefined && color !== undefined && category !== undefined}
<StatusIcon on:accent-color {category} {size} fill={color} {statusIcon} />
{/if}