Skip to content

Commit

Permalink
Tracker: Project - Editors (#1779)
Browse files Browse the repository at this point in the history
Signed-off-by: Artyom Grigorovich <grigorovichartyom@gmail.com>
  • Loading branch information
agrigorovich-xored authored May 18, 2022
1 parent c6b757d commit ae13a1f
Show file tree
Hide file tree
Showing 29 changed files with 1,079 additions and 205 deletions.
21 changes: 13 additions & 8 deletions packages/presentation/src/components/ObjectPopup.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,8 @@
let search: string = ''
let objects: Doc[] = []
$: selectedElements = new Set(selectedObjects)
const dispatch = createEventDispatcher()
const query = createQuery()
$: query.query<Doc>(
Expand All @@ -73,15 +75,18 @@
{ ...(options ?? {}), limit: 200 }
)
const isSelected = (person: Doc): boolean => {
if (selectedObjects.filter((p) => p === person._id).length > 0) return true
return false
}
const checkSelected = (person: Doc, objects: Doc[]): void => {
selectedObjects = isSelected(person)
? selectedObjects.filter((p) => p !== person._id)
: [...selectedObjects, person._id]
if (selectedElements.has(person._id)) {
selectedElements.delete(person._id)
} else {
selectedElements.add(person._id)
}
selectedObjects = Array.from(selectedElements)
dispatch('update', selectedObjects)
selectedElements = selectedElements
}
const client = getClient()
Expand Down Expand Up @@ -168,7 +173,7 @@
>
{#if multiSelect}
<div class="check pointer-events-none">
<CheckBox checked={isSelected(obj)} primary />
<CheckBox checked={selectedElements.has(obj._id)} primary />
</div>
{/if}

Expand Down
14 changes: 12 additions & 2 deletions packages/ui/src/components/Button.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -231,6 +231,16 @@
background-color: var(--button-disabled-color);
border-color: transparent;
}
&.selected {
background-color: var(--button-bg-hover);
border-color: var(--button-border-hover);
color: var(--caption-color);
.btn-icon {
color: var(--accent-color);
}
}
}
&.no-border {
font-weight: 400;
Expand Down Expand Up @@ -275,10 +285,10 @@
}
&.link-bordered {
padding: 0 0.375rem;
color: var(--acctent-color);
color: var(--accent-color);
border-color: var(--button-border-color);
&:hover {
color: var(--acctent-color);
color: var(--accent-color);
border-color: var(--button-border-hover);
.btn-icon {
color: var(--accent-color);
Expand Down
22 changes: 11 additions & 11 deletions plugins/activity-assets/src/tsdoc-metadata.json
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
// This file is read by tools that parse documentation comments conforming to the TSDoc standard.
// It should be published with your NPM package. It should not be tracked by Git.
{
"tsdocVersion": "0.12",
"toolPackages": [
{
"packageName": "@microsoft/api-extractor",
"packageVersion": "7.23.0"
}
]
}
// This file is read by tools that parse documentation comments conforming to the TSDoc standard.
// It should be published with your NPM package. It should not be tracked by Git.
{
"tsdocVersion": "0.12",
"toolPackages": [
{
"packageName": "@microsoft/api-extractor",
"packageVersion": "7.23.0"
}
]
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,12 @@
export let value: WithLookup<Employee>
export let shouldShowAvatar: boolean = true
export let shouldShowName: boolean = true
export let onEmployeeEdit: ((event: MouseEvent) => void) | undefined = undefined
let container: HTMLElement
function onEdit () {
const onEdit = () => {
showPopup(
EmployeePreviewPopup,
{
Expand All @@ -20,11 +22,13 @@
container
)
}
$: handlePersonEdit = onEmployeeEdit ?? onEdit
</script>

<div bind:this={container} class="flex-center container">
<div class="pr-2 over-underline">
<PersonPresenter {value} {onEdit} {shouldShowAvatar} />
<div class="over-underline" class:pr-2={shouldShowName}>
<PersonPresenter {value} onEdit={handlePersonEdit} {shouldShowAvatar} {shouldShowName} />
</div>
{#if value.$lookup?.statuses?.length}
<div class="status content-color">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@
}
}
.eContentPresenterIcon {
margin-right: 0.5rem;
margin-right: 0.25rem;
color: var(--theme-content-dark-color);
}
.eContentPresenterLabel {
Expand Down
16 changes: 16 additions & 0 deletions plugins/tracker-assets/assets/icons.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions plugins/tracker-assets/lang/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,10 @@
"Backlog": "Backlog",
"Board": "Board",
"Projects": "Projects",
"AllProjects": "All",
"BacklogProjects": "Backlog",
"ActiveProjects": "Active",
"ClosedProjects": "Closed",
"NewProject": "New project",
"CreateProject": "Create project",
"ProjectNamePlaceholder": "Project name",
Expand Down Expand Up @@ -101,6 +105,10 @@
"AddToProject": "Add to project\u2026",
"MoveToProject": "Move to project\u2026",
"NoProject": "No project",
"ProjectLeadTitle": "Project lead",
"ProjectMembersTitle": "Project members",
"ProjectLeadSearchPlaceholder": "Set project lead\u2026",
"ProjectMembersSearchPlaceholder": "Change project members\u2026",

"GotoIssues": "Go to issues",
"GotoActive": "Go to active issues",
Expand Down
6 changes: 5 additions & 1 deletion plugins/tracker-assets/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,11 @@ loadMetadata(tracker.icon, {
PriorityUrgent: `${icons}#priority-urgent`,
PriorityHigh: `${icons}#priority-high`,
PriorityMedium: `${icons}#priority-medium`,
PriorityLow: `${icons}#priority-low`
PriorityLow: `${icons}#priority-low`,

ProjectsList: `${icons}#list`,
ProjectsTimeline: `${icons}#timeline`,
ProjectMembers: `${icons}#projectMembers`
})

addStringsLoader(trackerId, async (lang: string) => await import(`../lang/${lang}.json`))
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<!--
// 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 { Timestamp } from '@anticrm/core'
import { DatePresenter, Tooltip, getDaysDifference } from '@anticrm/ui'
import DueDatePopup from './DueDatePopup.svelte'
import { getDueDateIconModifier } from '../utils'
export let dateMs: number | null = null
export let shouldRender: boolean = true
export let onDateChange: (newDate: number | null) => void
$: today = new Date(new Date(Date.now()).setHours(0, 0, 0, 0))
$: isOverdue = dateMs !== null && dateMs < today.getTime()
$: dueDate = dateMs === null ? null : new Date(dateMs)
$: daysDifference = dueDate === null ? null : getDaysDifference(today, dueDate)
$: iconModifier = getDueDateIconModifier(isOverdue, daysDifference)
$: formattedDate = !dateMs ? '' : new Date(dateMs).toLocaleString('default', { month: 'short', day: 'numeric' })
const handleDueDateChanged = async (event: CustomEvent<Timestamp>) => {
const newDate = event.detail
if (newDate === undefined || dateMs === newDate) {
return
}
onDateChange(newDate)
}
</script>

{#if shouldRender}
{#if formattedDate}
<Tooltip
direction={'top'}
component={DueDatePopup}
props={{
formattedDate: formattedDate,
daysDifference: daysDifference,
isOverdue: isOverdue,
iconModifier: iconModifier
}}
>
<DatePresenter
value={dateMs}
editable={true}
shouldShowLabel={false}
icon={iconModifier}
on:change={handleDueDateChanged}
/>
</Tooltip>
{:else}
<DatePresenter
value={dateMs}
editable={true}
shouldShowLabel={false}
icon={iconModifier}
on:change={handleDueDateChanged}
/>
{/if}
{/if}
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
-->
<script lang="ts">
import { Icon, Label, IconDPCalendarOver, IconDPCalendar } from '@anticrm/ui'
import tracker from '../../plugin'
import tracker from '../plugin'
export let formattedDate: string = ''
export let daysDifference: number = 0
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
-->
<script lang="ts">
import { Ref, WithLookup } from '@anticrm/core'
import { IssueStatus } from '@anticrm/tracker'
import { Button, showPopup, SelectPopup, eventToHTMLElement } from '@anticrm/ui'
import type { ButtonKind, ButtonSize } from '@anticrm/ui'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,7 @@
if (!isEditable) {
return
}
showPopup(
UsersPopup,
{
Expand All @@ -90,7 +91,7 @@
isInteractive={true}
shouldShowPlaceholder={true}
shouldShowName={shouldShowLabel}
onEdit={handleAssigneeEditorOpened}
onEmployeeEdit={handleAssigneeEditorOpened}
tooltipLabels={{ personLabel: tracker.string.AssignedTo, placeholderLabel: tracker.string.AssignTo }}
/>
{/if}
Original file line number Diff line number Diff line change
Expand Up @@ -13,59 +13,30 @@
// limitations under the License.
-->
<script lang="ts">
import { Timestamp, WithLookup } from '@anticrm/core'
import { WithLookup } from '@anticrm/core'
import { Issue } from '@anticrm/tracker'
import { DatePresenter, Tooltip, getDaysDifference } from '@anticrm/ui'
import { getClient } from '@anticrm/presentation'
import DueDatePopup from './DueDatePopup.svelte'
import CommonTrackerDatePresenter from '../CommonTrackerDatePresenter.svelte'
import tracker from '../../plugin'
import { getDueDateIconModifier } from '../../utils'
export let value: WithLookup<Issue>
const client = getClient()
$: today = new Date(new Date(Date.now()).setHours(0, 0, 0, 0))
$: dueDateMs = value.dueDate
$: isOverdue = dueDateMs !== null && dueDateMs < today.getTime()
$: dueDate = dueDateMs === null ? null : new Date(dueDateMs)
$: daysDifference = dueDate === null ? null : getDaysDifference(today, dueDate)
$: iconModifier = getDueDateIconModifier(isOverdue, daysDifference)
$: formattedDate = !dueDateMs ? '' : new Date(dueDateMs).toLocaleString('default', { month: 'short', day: 'numeric' })
const handleDueDateChanged = async (event: CustomEvent<Timestamp>) => {
const newDate = event.detail
if (newDate === undefined || value.dueDate === newDate) {
return
}
const handleDueDateChanged = async (newDate: number | null) => {
await client.update(value, { dueDate: newDate })
}
$: shouldRenderPresenter =
dueDateMs &&
dueDateMs !== null &&
value.$lookup?.status?.category !== tracker.issueStatusCategory.Completed &&
value.$lookup?.status?.category !== tracker.issueStatusCategory.Canceled
</script>

{#if shouldRenderPresenter}
<Tooltip
direction={'top'}
component={DueDatePopup}
props={{
formattedDate: formattedDate,
daysDifference: daysDifference,
isOverdue: isOverdue,
iconModifier: iconModifier
}}
>
<DatePresenter
value={dueDateMs}
editable={true}
shouldShowLabel={false}
icon={iconModifier}
on:change={handleDueDateChanged}
/>
</Tooltip>
{/if}
<CommonTrackerDatePresenter
dateMs={dueDateMs}
shouldRender={shouldRenderPresenter}
onDateChange={handleDueDateChanged}
/>
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<!--
// 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 { WithLookup } from '@anticrm/core'
import { Project } from '@anticrm/tracker'
import { Button } from '@anticrm/ui'
export let value: WithLookup<Project>
</script>

<Button size="small" kind="link" icon={value.icon} />
Loading

0 comments on commit ae13a1f

Please sign in to comment.