Skip to content

Commit 4d59e79

Browse files
haiodohaiodo
authored
Move UI changes to main (#6161)
Signed-off-by: Alexander Platov <[email protected]>
1 parent 5d7e109 commit 4d59e79

File tree

17 files changed

+107
-67
lines changed

17 files changed

+107
-67
lines changed

Diff for: ‎packages/theme/styles/popups.scss

-1
Original file line numberDiff line numberDiff line change
@@ -194,7 +194,6 @@
194194
height: max-content;
195195
overflow-x: hidden;
196196
overflow-y: auto;
197-
scrollbar-width: thin;
198197

199198
&::-webkit-scrollbar { width: 0; }
200199
.box {

Diff for: ‎packages/ui/src/components/Button.svelte

+2
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@
5757
export let title: string | undefined = undefined
5858
export let borderStyle: 'solid' | 'dashed' | 'none' = 'solid'
5959
export let id: string | undefined = undefined
60+
export let dataId: string | undefined = undefined
6061
export let input: HTMLButtonElement | undefined = undefined
6162
export let showTooltip: LabelAndProps | undefined = undefined
6263
export let short: boolean = false
@@ -154,6 +155,7 @@
154155
on:mousemove
155156
on:mouseleave
156157
{id}
158+
data-id={dataId}
157159
>
158160
{#if icon && !loading}
159161
<div class="btn-icon pointer-events-none" class:resetIconSize={resetIconSize === 'icon'}>

Diff for: ‎packages/ui/src/components/NotificationToast.svelte

+3-3
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@
4343
$: icon = getIcon()
4444
</script>
4545

46-
<div class="root" in:fade out:fade>
46+
<div class="notifyPopup" in:fade out:fade>
4747
<div class="flex-between">
4848
<div class="flex-row-center">
4949
{#if icon}
@@ -60,7 +60,7 @@
6060
<span class="overflow-label fs-bold text-base caption-color">{title}</span>
6161
</div>
6262
{#if onClose !== undefined}
63-
<Button icon={Close} kind="ghost" size="small" on:click={onClose} />
63+
<Button icon={Close} kind="ghost" size="small" dataId={'btnNotifyClose'} on:click={onClose} />
6464
{/if}
6565
</div>
6666

@@ -76,7 +76,7 @@
7676
</div>
7777

7878
<style lang="scss">
79-
.root {
79+
.notifyPopup {
8080
overflow: hidden;
8181
display: flex;
8282
flex-direction: column;

Diff for: ‎plugins/activity-resources/src/components/ActivityMessageAction.svelte

+4-2
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@
2222
export let iconProps: any | undefined = undefined
2323
export let size: IconSize = 'small'
2424
export let action: (ev: MouseEvent) => Promise<void> | void = async () => {}
25-
export let opened = false
25+
export let opened: boolean = false
26+
export let dataId: string | undefined = undefined
2627
2728
function onClick (ev: MouseEvent): void {
2829
ev.stopPropagation()
@@ -38,6 +39,7 @@
3839
size="small"
3940
kind="tertiary"
4041
pressed={opened}
41-
on:click={onClick}
42+
{dataId}
4243
tooltip={{ label }}
44+
on:click={onClick}
4345
/>

Diff for: ‎plugins/activity-resources/src/components/ActivityMessageActions.svelte

+6-4
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@
7979
</script>
8080

8181
{#if message}
82-
<div class="root">
82+
<div class="activityMessage-actionPopup">
8383
{#each inlineActions as inline}
8484
{#if inline.icon}
8585
{#await getResource(inline.action) then action}
@@ -88,6 +88,7 @@
8888
size={inline.actionProps?.size ?? 'small'}
8989
icon={inline.icon}
9090
iconProps={inline.actionProps?.iconProps}
91+
dataId={inline._id}
9192
action={(ev) => action(message, ev, { onOpen, onClose })}
9293
/>
9394
{/await}
@@ -96,18 +97,19 @@
9697

9798
{#if withActionMenu}
9899
<ActivityMessageAction
99-
size="small"
100100
icon={IconMoreV}
101+
label={view.string.MoreActions}
102+
size={'small'}
101103
opened={isActionMenuOpened}
104+
dataId={'btnMoreActions'}
102105
action={showMenu}
103-
label={view.string.MoreActions}
104106
/>
105107
{/if}
106108
</div>
107109
{/if}
108110

109111
<style lang="scss">
110-
.root {
112+
.activityMessage-actionPopup {
111113
display: flex;
112114
align-items: center;
113115
border-radius: 0.375rem;

Diff for: ‎plugins/task-resources/src/components/state/StatePresenter.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -41,12 +41,12 @@
4141
export let shouldShowAvatar = true
4242
export let inline: boolean = false
4343
export let disabled: boolean = false
44-
export let oneLine: boolean = false
44+
export let oneLine: boolean = true
4545
export let shouldShowName: boolean = true
4646
export let shouldShowTooltip: boolean = false
4747
export let noUnderline: boolean = false
4848
export let accent: boolean = false
49-
export let shrink: number = 0
49+
export let shrink: number = 1
5050
export let space: Ref<Project> | undefined = undefined
5151
export let projectType: Ref<ProjectType> | undefined = $selectedTypeStore
5252
export let taskType: Ref<TaskType> | undefined = undefined

Diff for: ‎plugins/task-resources/src/components/state/StateRefPresenter.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
export let kind: ButtonKind = 'link'
2828
export let size: ButtonSize = 'medium'
2929
export let shouldShowName: boolean = true
30-
export let shrink: number = 0
30+
export let shrink: number = 1
3131
export let disabled: boolean = false
3232
3333
import { selectedTaskTypeStore, selectedTypeStore } from '../../index'

Diff for: ‎plugins/templates-resources/src/components/Templates.svelte

+2-1
Original file line numberDiff line numberDiff line change
@@ -162,7 +162,7 @@
162162

163163
<div class="hulyComponent-content__container columns">
164164
<div class="hulyComponent-content__column">
165-
<div id="create-template" class="flex-between trans-title m-3">
165+
<div id="create-template" class="flex-between trans-title flex-no-shrink bottom-divider p-3">
166166
<Button
167167
icon={templatesPlugin.icon.Template}
168168
label={templatesPlugin.string.CreateTemplate}
@@ -179,6 +179,7 @@
179179
label={getEmbeddedLabel(space.name)}
180180
actions={async () => await getSpaceActions(space)}
181181
isFold
182+
noDivider
182183
empty={getTemps.length === 0}
183184
>
184185
{#each getTemps as t (t._id)}

Diff for: ‎plugins/text-editor-resources/src/components/TextActionButton.svelte

+1
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@
6666
class:selected
6767
use:tooltip={{ label: action.label }}
6868
tabindex="0"
69+
data-id={'btn' + action.label.split(':').pop()}
6970
on:click|preventDefault|stopPropagation={handleClick}
7071
>
7172
<Icon icon={action.icon} {size} />

Diff for: ‎plugins/time-resources/src/components/DueDateEditor.svelte

+1
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@
5555
type="type-button"
5656
icon={time.icon.Calendar}
5757
iconSize="small"
58+
id={'dueDateButton'}
5859
title={buttonTitle}
5960
label={buttonLabel}
6061
pressed={opened}

Diff for: ‎plugins/view-resources/src/components/ObjectPresenter.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,10 @@
2727
export let accent: boolean = false
2828
export let colorInherit: boolean = false
2929
export let shouldShowAvatar: boolean = true
30-
export let noUnderline: boolean = false
30+
export let noUnderline: boolean = true
3131
export let disabled: boolean = false
3232
export let shouldShowName: boolean = true
33-
export let shrink: number = 0
33+
export let shrink: number = 1
3434
export let exact = false
3535
3636
const client = getClient()

Diff for: ‎plugins/workbench-resources/src/components/ServerManager.svelte

+47-32
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,13 @@
1010
import ServerManagerGeneral from './ServerManagerGeneral.svelte'
1111
1212
import { getEmbeddedLabel } from '@hcengineering/platform'
13-
import { Panel, TabItem, TabList } from '@hcengineering/ui'
13+
import { createEventDispatcher } from 'svelte'
14+
import presentation from '@hcengineering/presentation'
15+
import { Header, TabItem, Switcher, Breadcrumb, IconSettings, ButtonIcon, IconClose } from '@hcengineering/ui'
1416
import ServerManagerAccountStatistics from './ServerManagerAccountStatistics.svelte'
1517
18+
const dispatch = createEventDispatcher()
19+
1620
const tabs: TabItem[] = [
1721
{
1822
id: 'general',
@@ -42,35 +46,46 @@
4246
let selectedTab: string | number = tabs[0].id
4347
</script>
4448

45-
<Panel on:close isFullSize useMaxWidth={true}>
46-
<svelte:fragment slot="title">
47-
<span class="p-3"> Server manager </span>
48-
<TabList
49-
items={tabs}
50-
bind:selected={selectedTab}
51-
kind={'separated'}
52-
on:select={(result) => {
53-
selectedTab = result.detail.id
54-
}}
55-
/>
56-
</svelte:fragment>
57-
{#if selectedTab === 'general'}
58-
<ServerManagerGeneral />
59-
{:else if selectedTab === 'users'}
60-
<ServerManagerUsers />
61-
{:else if selectedTab === 'statistics'}
62-
<ServerManagerServerStatistics />
63-
{:else if selectedTab === 'statistics-front'}
64-
<ServerManagerFrontStatistics />
65-
{:else if selectedTab === 'statistics-collab'}
66-
<ServerManagerCollaboratorStatistics />
67-
{:else if selectedTab === 'account'}
68-
<ServerManagerAccountStatistics />
69-
{/if}
70-
</Panel>
49+
<div class="hulyComponent">
50+
<Header type={'type-panel'} freezeBefore>
51+
<svelte:fragment slot="beforeTitle">
52+
<ButtonIcon
53+
icon={IconClose}
54+
kind={'secondary'}
55+
size={'small'}
56+
tooltip={{ label: presentation.string.Close }}
57+
on:click={() => dispatch('close')}
58+
/>
59+
</svelte:fragment>
60+
61+
<Breadcrumb icon={IconSettings} title={'Server manager'} size={'large'} isCurrent />
62+
63+
<svelte:fragment slot="actions">
64+
<Switcher
65+
name={'swManagerMode'}
66+
items={tabs}
67+
bind:selected={selectedTab}
68+
kind={'subtle'}
69+
on:select={(result) => {
70+
selectedTab = result.detail.id
71+
}}
72+
/>
73+
</svelte:fragment>
74+
</Header>
7175

72-
<style lang="scss">
73-
.greyed {
74-
color: rgba(black, 0.5);
75-
}
76-
</style>
76+
<div class="hulyComponent-content__column content">
77+
{#if selectedTab === 'general'}
78+
<ServerManagerGeneral />
79+
{:else if selectedTab === 'users'}
80+
<ServerManagerUsers />
81+
{:else if selectedTab === 'statistics'}
82+
<ServerManagerServerStatistics />
83+
{:else if selectedTab === 'statistics-front'}
84+
<ServerManagerFrontStatistics />
85+
{:else if selectedTab === 'statistics-collab'}
86+
<ServerManagerCollaboratorStatistics />
87+
{:else if selectedTab === 'account'}
88+
<ServerManagerAccountStatistics />
89+
{/if}
90+
</div>
91+
</div>

Diff for: ‎tests/sanity/tests/custom-atributes/class-properties-page.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class ClassProperties {
3131
inputName = (): Locator => this.page.getByPlaceholder('Name')
3232
createButton = (): Locator => this.page.getByRole('button', { name: 'Create' })
3333
enterTextString = (): Locator => this.page.getByPlaceholder('Type text...')
34-
confirmChange = (): Locator => this.page.locator('.ml-2 > .antiButton')
34+
confirmChange = (): Locator => this.page.locator('.selectPopup button')
3535

3636
async selectDataType (dataType: DataType): Promise<void> {
3737
switch (dataType) {

Diff for: ‎tests/sanity/tests/model/channel-page.ts

+24-8
Original file line numberDiff line numberDiff line change
@@ -14,17 +14,33 @@ export class ChannelPage {
1414
readonly channelTab = (): Locator => this.page.getByRole('link', { name: 'Channels' }).getByRole('button')
1515
readonly channelTable = (): Locator => this.page.getByRole('table')
1616
readonly channel = (channel: string): Locator => this.page.getByRole('button', { name: channel })
17+
readonly channelNameOnDetail = (channel: string): Locator =>
18+
this.page
19+
.locator('span.labelOnPanel', { hasText: 'Name' })
20+
.locator('xpath=following-sibling::div[1]')
21+
.locator('button', { hasText: channel })
22+
1723
readonly chooseChannel = (channel: string): Locator => this.page.getByRole('button', { name: channel })
18-
readonly closePopupWindow = (): Locator => this.page.locator('.root > div > .antiButton').first()
24+
readonly closePopupWindow = (): Locator => this.page.locator('.notifyPopup button[data-id="btnNotifyClose"]')
1925
readonly openAddMemberToChannel = (userName: string): Locator => this.page.getByRole('button', { name: userName })
2026
readonly addMemberToChannelButton = (userName: string): Locator => this.page.getByText(userName)
2127
readonly joinChannelButton = (): Locator => this.page.getByRole('button', { name: 'Join' })
22-
readonly addEmojiButton = (): Locator => this.page.locator('.root > button').first()
28+
readonly addEmojiButton = (): Locator =>
29+
this.page.locator('.activityMessage-actionPopup > button[data-id$="AddReactionAction"]')
30+
2331
readonly selectEmoji = (emoji: string): Locator => this.page.getByText(emoji)
24-
readonly saveMessageButton = (): Locator => this.page.locator('.root > button:nth-child(2)')
25-
readonly pinMessageButton = (): Locator => this.page.locator('.root > button:nth-child(3)')
26-
readonly replyButton = (): Locator => this.page.locator('.root > button:nth-child(4)')
27-
readonly openMoreButton = (): Locator => this.page.locator('.root > button:nth-child(5)')
32+
readonly saveMessageButton = (): Locator =>
33+
this.page.locator('.activityMessage-actionPopup > button[data-id$="SaveForLaterAction"]')
34+
35+
readonly pinMessageButton = (): Locator =>
36+
this.page.locator('.activityMessage-actionPopup > button[data-id$="PinMessageAction"]')
37+
38+
readonly replyButton = (): Locator =>
39+
this.page.locator('.activityMessage-actionPopup > button[data-id$="ReplyToThreadAction"]')
40+
41+
readonly openMoreButton = (): Locator =>
42+
this.page.locator('.activityMessage-actionPopup > button[data-id="btnMoreActions"]')
43+
2844
readonly messageSaveMarker = (): Locator => this.page.locator('.saveMarker')
2945
readonly saveMessageTab = (): Locator => this.page.getByRole('button', { name: 'Saved' })
3046
readonly pinnedMessageButton = (): Locator => this.page.getByRole('button', { name: 'pinned' })
@@ -36,7 +52,7 @@ export class ChannelPage {
3652
readonly deleteMessageButton = (): Locator => this.page.getByRole('button', { name: 'Delete' })
3753
readonly updateButton = (): Locator => this.page.getByRole('button', { name: 'Update' })
3854
readonly openChannelDetails = (): Locator => this.page.locator('.hulyHeader-buttonsGroup > .antiButton')
39-
readonly changeChannelNameConfirm = (): Locator => this.page.locator('.ml-2 > .antiButton')
55+
readonly changeChannelNameConfirm = (): Locator => this.page.locator('.selectPopup button')
4056
readonly privateOrPublicChangeButton = (change: string, autoJoin: boolean): Locator =>
4157
this.page
4258
.locator('span.labelOnPanel', { hasText: autoJoin ? 'Auto join' : 'Private' })
@@ -64,7 +80,7 @@ export class ChannelPage {
6480
}
6581

6682
async changeChannelName (channel: string): Promise<void> {
67-
await this.channel(channel).nth(2).click()
83+
await this.channelNameOnDetail(channel).click()
6884
await this.page.keyboard.type('New Channel Name')
6985
await this.changeChannelNameConfirm().click()
7086
}

Diff for: ‎tests/sanity/tests/model/documents/document-content-page.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export class DocumentContentPage extends CommonPage {
1111

1212
readonly buttonDocumentTitle = (): Locator => this.page.locator('div[class*="main-content"] div.title input')
1313
readonly inputContent = (): Locator => this.page.locator('div.textInput div.tiptap')
14-
readonly buttonToolbarLink = (): Locator => this.page.locator('div.text-editor-toolbar button:nth-child(10)')
14+
readonly buttonToolbarLink = (): Locator => this.page.locator('div.text-editor-toolbar button[data-id="btnLink"]')
1515
readonly inputFormLink = (): Locator => this.page.locator('form[id="text-editor:string:Link"] input')
1616
readonly buttonFormLinkSave = (): Locator =>
1717
this.page.locator('form[id="text-editor:string:Link"] button[type="submit"]')

Diff for: ‎tests/sanity/tests/model/planning/planning-page.ts

+2-6
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,8 @@ export class PlanningPage extends CalendarPage {
2121
readonly inputPopupCreateTitle = (): Locator => this.popup().locator('input[type="text"]')
2222
readonly inputPopupCreateDescription = (): Locator => this.popup().locator('div.tiptap')
2323
readonly inputPanelCreateDescription = (): Locator => this.panel().locator('div.tiptap')
24-
readonly buttonPopupCreateDueDate = (): Locator =>
25-
this.popup().locator('div.block:first-child div.flex-row-center button:nth-child(3)')
26-
27-
readonly buttonPanelCreateDueDate = (): Locator =>
28-
this.panel().locator('div.slots-content div.flex-row-top.justify-between div.flex-row-center button:first-child')
29-
24+
readonly buttonPopupCreateDueDate = (): Locator => this.popup().locator('button#dueDateButton')
25+
readonly buttonPanelCreateDueDate = (): Locator => this.panel().locator('button#dueDateButton')
3026
readonly buttonPopupCreatePriority = (): Locator => this.popup().locator('button#priorityButton')
3127
readonly buttonPanelCreatePriority = (): Locator => this.panel().locator('button#priorityButton')
3228
readonly buttonPopupCreateVisible = (): Locator => this.popup().locator('button#visibleButton')

Diff for: ‎tests/sanity/tests/model/tracker/issues-page.ts

+8-3
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,12 @@ export class IssuesPage extends CommonTrackerPage {
113113
createdTab = (): Locator => this.page.locator('[data-id="tab-created"]')
114114
subscribedTab = (): Locator => this.page.locator('[data-id="tab-subscribed"]')
115115
issueListPanel = (): Locator => this.page.locator('.hulyComponent')
116-
notTrackButton = (): Locator => this.page.locator('button:has-text("Appleseed John") >> nth=1')
116+
notTrackButton = (): Locator =>
117+
this.page
118+
.locator('span.labelOnPanel', { hasText: 'Collaborators' })
119+
.locator('xpath=following-sibling::div[1]')
120+
.locator('button')
121+
117122
selectPopup = (): Locator => this.page.locator('.selectPopup >> button:has-text("Appleseed John")')
118123
notificationTimeoutSetting = (timeout: string): Promise<void> => {
119124
return this.page.evaluate((timeout) => {
@@ -136,7 +141,7 @@ export class IssuesPage extends CommonTrackerPage {
136141
issueName = (name: string): Locator => this.page.locator(`text="${name}"`)
137142
issuesButton = (): Locator => this.page.locator('text="Issues"')
138143
viewButton = (): Locator => this.page.locator('button[data-id="btn-viewOptions"]')
139-
orderingButton = (): Locator => this.page.locator('.ordering >> nth=0')
144+
orderingButton = (): Locator => this.page.locator('.ordering button')
140145
modifiedDateMenuItem = (): Locator => this.page.locator('button.menu-item', { hasText: 'Modified date' })
141146
estimationContainer = (): Locator => this.page.locator('.estimation-container').first()
142147
addTimeReportButton = (): Locator => this.page.locator('button:has-text("Add time report")')
@@ -158,7 +163,7 @@ export class IssuesPage extends CommonTrackerPage {
158163
dueDateButton = (): Locator => this.page.locator('button:has-text("Due date")')
159164
specificDay = (day: string): Locator => this.page.locator(`.date-popup-container div.day >> text=${day}`).first()
160165
inputTextPlaceholder = (): Locator => this.page.getByPlaceholder('Type text...')
161-
confirmInput = (): Locator => this.page.locator('.ml-2 > .antiButton')
166+
confirmInput = (): Locator => this.page.locator('.selectPopup button')
162167

163168
async navigateToIssues (): Promise<void> {
164169
await this.page.click('text="Issues"')

0 commit comments

Comments
 (0)