Skip to content

Commit 73a8e91

Browse files
quangtuanitmo18quangtuanitmo18
committed
address comments review
1 parent 3c77332 commit 73a8e91

6 files changed

Lines changed: 116 additions & 100 deletions

File tree

‎src/components/event/EventActionsMenu.vue‎

Lines changed: 93 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,104 @@
11
<template>
22
<ContextMenu
33
class="event-actions-menu"
4-
:items="items"
4+
:items="menuItems"
55
/>
66
</template>
77

8-
<script setup lang="ts">
9-
import { ContextMenu, type ContextMenuItem } from '@codexteam/ui/vue';
8+
<script lang="ts">
9+
import { REMOVE_EVENT } from '@/store/modules/events/actionTypes';
10+
import { ContextMenu, ContextMenuItem } from '@codexteam/ui/vue';
11+
import notifier from 'codex-notifier';
12+
import { defineComponent, PropType } from 'vue';
13+
import { i18n } from '../../i18n';
14+
import { ActionType } from '../utils/ConfirmationWindow/types';
1015
11-
/**
12-
* Event actions menu props
13-
*/
14-
interface Props {
15-
/**
16-
* List of action items to show in the menu
17-
*/
18-
items: ContextMenuItem[];
19-
}
16+
export default defineComponent({
17+
name: 'EventActionsMenu',
18+
components: {
19+
ContextMenu,
20+
},
21+
props: {
22+
/**
23+
* Project id the event belongs to
24+
*/
25+
projectId: {
26+
type: String,
27+
required: true,
28+
},
29+
/**
30+
* Original event id to remove
31+
*/
32+
eventId: {
33+
type: String,
34+
required: true,
35+
},
36+
/**
37+
* Callback to close popover
38+
*/
39+
onClose: {
40+
type: Function as PropType<() => void>,
41+
default: null,
42+
},
43+
},
44+
computed: {
45+
/**
46+
* Actions available in event context menu
47+
*/
48+
menuItems(): ContextMenuItem[] {
49+
return [
50+
{
51+
type: 'default',
52+
title: i18n.global.t('event.remove') as string,
53+
icon: 'Trash',
54+
onActivate: () => {
55+
this.onClose?.();
56+
this.confirmRemoveEvent();
57+
},
58+
},
59+
];
60+
},
61+
},
62+
methods: {
63+
/**
64+
* Show confirmation dialog and remove event on confirm
65+
*/
66+
confirmRemoveEvent() {
67+
this.$confirm.open({
68+
description: i18n.global.t('event.removeConfirmation').toString(),
69+
actionType: ActionType.DELETION,
70+
continueButtonText: i18n.global.t('event.removeButton').toString(),
71+
onConfirm: async () => {
72+
const isRemoved = await this.$store.dispatch(REMOVE_EVENT, {
73+
projectId: this.projectId,
74+
eventId: this.eventId,
75+
});
76+
77+
if (isRemoved) {
78+
notifier.show({
79+
message: i18n.global.t('event.removeSuccess').toString(),
80+
style: 'success',
81+
time: 5000,
82+
});
83+
this.$router.push({
84+
name: 'project-overview',
85+
params: { projectId: this.projectId },
86+
query: { reload: String(Date.now()) },
87+
});
88+
89+
return;
90+
}
2091
21-
defineProps<Props>();
92+
notifier.show({
93+
message: i18n.global.t('errors.Something went wrong').toString(),
94+
style: 'error',
95+
time: 5000,
96+
});
97+
},
98+
});
99+
},
100+
},
101+
});
22102
</script>
23103

24104
<style scoped>

‎src/components/event/EventHeader.vue‎

Lines changed: 5 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -132,16 +132,14 @@ import AssigneeBar from '../utils/AssigneeBar.vue';
132132
import EntityImage from '../utils/EntityImage.vue';
133133
134134
import { HawkEvent, HawkEventBacktraceFrame } from '@/types/events';
135-
import { REMOVE_EVENT, TOGGLE_EVENT_MARK } from '@/store/modules/events/actionTypes';
135+
import { TOGGLE_EVENT_MARK } from '@/store/modules/events/actionTypes';
136136
import { Project } from '@/types/project';
137137
import { Workspace } from '@/types/workspaces';
138138
import { projectBadges } from '../../mixins/projectBadges';
139139
import ProjectBadge from '../project/ProjectBadge.vue';
140140
import { JavaScriptAddons } from '@hawk.so/types';
141-
import { ContextMenuItem, usePopover } from '@codexteam/ui/vue';
141+
import { usePopover } from '@codexteam/ui/vue';
142142
import EventActionsMenu from './EventActionsMenu.vue';
143-
import { ActionType } from '../utils/ConfirmationWindow/types';
144-
import notifier from 'codex-notifier';
145143
import Icon from '../utils/Icon.vue';
146144
147145
export default defineComponent({
@@ -167,7 +165,6 @@ export default defineComponent({
167165
validator: prop => typeof prop === 'object' || prop === null,
168166
},
169167
},
170-
emits: ['event-deleted'],
171168
setup() {
172169
const { showPopover, hide } = usePopover();
173170
@@ -333,23 +330,6 @@ export default defineComponent({
333330
}
334331
},
335332
336-
/**
337-
* Build "more options" context menu items
338-
*/
339-
eventActionsMenuItems(): ContextMenuItem[] {
340-
return [
341-
{
342-
type: 'default',
343-
title: this.$t('event.remove') as string,
344-
icon: 'Trash',
345-
onActivate: () => {
346-
this.hidePopover();
347-
this.confirmRemoveEvent();
348-
},
349-
},
350-
];
351-
},
352-
353333
/**
354334
* Open the "more options" context menu near the 3-dot button
355335
*
@@ -365,7 +345,9 @@ export default defineComponent({
365345
with: {
366346
component: EventActionsMenu,
367347
props: {
368-
items: this.eventActionsMenuItems(),
348+
projectId: this.projectId,
349+
eventId: this.$route.params.eventId,
350+
onClose: () => this.hidePopover(),
369351
},
370352
},
371353
align: {
@@ -374,42 +356,6 @@ export default defineComponent({
374356
},
375357
});
376358
},
377-
378-
/**
379-
* Show confirmation dialog and, on confirm, delete the event then navigate back
380-
*/
381-
confirmRemoveEvent() {
382-
const { projectId, eventId } = this.$route.params;
383-
384-
this.$confirm.open({
385-
description: this.$t('event.removeConfirmation').toString(),
386-
actionType: ActionType.DELETION,
387-
continueButtonText: this.$t('event.removeButton').toString(),
388-
onConfirm: async () => {
389-
const isRemoved = await this.$store.dispatch(REMOVE_EVENT, {
390-
projectId,
391-
eventId,
392-
});
393-
394-
if (isRemoved) {
395-
notifier.show({
396-
message: this.$t('event.removeSuccess').toString(),
397-
style: 'success',
398-
time: 5000,
399-
});
400-
this.$emit('event-deleted');
401-
402-
return;
403-
}
404-
405-
notifier.show({
406-
message: this.$t('event.removeError').toString(),
407-
style: 'error',
408-
time: 5000,
409-
});
410-
},
411-
});
412-
},
413359
},
414360
});
415361
</script>

‎src/components/event/Layout.vue‎

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@
77
<EventHeader
88
v-if="event || loading"
99
:event="event"
10-
@event-deleted="onEventDeleted"
1110
/>
1211
<div class="event-layout__info">
1312
<div class="event-layout__container">
@@ -46,7 +45,6 @@ export default defineComponent({
4645
PopupDialog,
4746
EventHeader,
4847
},
49-
emits: ['event-deleted'],
5048
data() {
5149
return {
5250
/**
@@ -127,18 +125,6 @@ export default defineComponent({
127125
});
128126
}
129127
},
130-
131-
/**
132-
* Called when EventHeader signals that the event was deleted.
133-
* and navigates back to the project overview to close the modal.
134-
*/
135-
onEventDeleted() {
136-
this.$emit('event-deleted');
137-
this.$router.push({
138-
name: 'project-overview',
139-
params: { projectId: this.projectId },
140-
});
141-
},
142128
},
143129
});
144130
</script>

‎src/components/project/Overview.vue‎

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,7 @@
2424
</div>
2525
</div>
2626
<router-view v-slot="{ Component }">
27-
<component
28-
:is="Component"
29-
@event-deleted="eventDeleted"
30-
/>
27+
<component :is="Component" />
3128
</router-view>
3229
</div>
3330
</template>
@@ -89,6 +86,19 @@ export default {
8986
return this.workspace?.isBlocked;
9087
},
9188
},
89+
watch: {
90+
/**
91+
* Refresh list when route gets a new reload token
92+
*
93+
* @param newValue
94+
* @param oldValue
95+
*/
96+
'$route.query.reload'(newValue, oldValue) {
97+
if (newValue && newValue !== oldValue) {
98+
this.reloadDailyEvents();
99+
}
100+
},
101+
},
92102
93103
/**
94104
* Vue created hook
@@ -150,10 +160,6 @@ export default {
150160
this.$refs.eventsList.reloadDailyEvents();
151161
}
152162
},
153-
154-
async eventDeleted() {
155-
this.reloadDailyEvents();
156-
},
157163
},
158164
};
159165
</script>

‎src/i18n/messages/en.json‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -615,10 +615,9 @@
615615
"upgradeButton": "Pay and view event"
616616
},
617617
"remove": "Remove event",
618-
"removeConfirmation": "Are you sure you want to remove this event? All repetitions and related data will also be removed.",
618+
"removeConfirmation": "Are you sure you want to remove this event? All related data will also be removed.",
619619
"removeButton": "Remove",
620-
"removeSuccess": "Event successfully removed",
621-
"removeError": "Failed to remove the event"
620+
"removeSuccess": "Event successfully removed"
622621
},
623622
"common": {
624623
"workspace": "Workspace",

‎src/i18n/messages/ru.json‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -615,10 +615,9 @@
615615
"upgradeButton": "Оплатить и посмотреть событие"
616616
},
617617
"remove": "Удалить событие",
618-
"removeConfirmation": "Вы уверены, что хотите удалить это событие? Все повторения и связанные данные также будут удалены.",
618+
"removeConfirmation": "Вы уверены, что хотите удалить это событие? Все связанные данные также будут удалены.",
619619
"removeButton": "Удалить",
620-
"removeSuccess": "Событие успешно удалено",
621-
"removeError": "Не удалось удалить событие"
620+
"removeSuccess": "Событие успешно удалено"
622621
},
623622
"common": {
624623
"workspace": "Воркспейc",

0 commit comments

Comments
 (0)