Skip to content

Commit bfad55c

Browse files
tabiodunBradenM
tabiodun
authored and
BradenM
committed
- Support Event Logging
- Fix issue with adding organization name to registration (cherry picked from commit 918badf7f29c995a2f190449bc98609b79a07d50)
1 parent cda3976 commit bfad55c

File tree

13 files changed

+92
-64
lines changed

13 files changed

+92
-64
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@
5454
"@types/leaflet.gridlayer.googlemutant": "^0.4.6",
5555
"@types/leaflet.heat": "^0.2.1",
5656
"@vitejs/plugin-vue-jsx": "^2.1.1",
57-
"@vueform/multiselect": "^2.5.7",
57+
"@vueform/multiselect": "^2.5.8",
5858
"@vuepic/vue-datepicker": "^3.6.3",
5959
"@vueuse/core": "^9.6.0",
6060
"@vueuse/integrations": "^9.6.0",

‎pnpm-lock.yaml‎

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/BaseButton.vue‎

Lines changed: 40 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -23,15 +23,21 @@
2323
</template>
2424

2525
<script lang="ts">
26-
import { kebabCase } from "lodash";
27-
import { ref, computed, defineComponent, PropType } from "vue";
28-
import { BUTTON_VARIANTS as VARIANTS, ICON_SIZES, ICONS } from "../constants";
29-
30-
type ButtonSize = "small" | "medium" | "large" | "sm" | "md" | "lg";
26+
import { kebabCase } from 'lodash';
27+
import type { PropType } from 'vue';
28+
import { ref, computed, defineComponent } from 'vue';
29+
import type {
30+
BUTTON_VARIANTS as VARIANTS,
31+
ICON_SIZES,
32+
ICONS,
33+
} from '../constants';
34+
import useLogEvent from '@/hooks/useLogEvent';
35+
36+
type ButtonSize = 'small' | 'medium' | 'large' | 'sm' | 'md' | 'lg';
3137
type IconSize = typeof ICON_SIZES[number];
3238
3339
export default defineComponent({
34-
name: "BaseButton",
40+
name: 'BaseButton',
3541
3642
props: {
3743
action: {
@@ -48,51 +54,51 @@ export default defineComponent({
4854
},
4955
text: {
5056
type: String,
51-
default: "",
57+
default: '',
5258
},
5359
alt: {
5460
type: String,
55-
default: "button",
61+
default: 'button',
5662
},
5763
title: {
5864
type: String,
59-
default: "",
65+
default: '',
6066
},
6167
ccuEvent: {
6268
type: String,
63-
default: "",
69+
default: '',
6470
},
6571
size: {
6672
type: String as PropType<ButtonSize>,
67-
default: "",
73+
default: '',
6874
},
6975
icon: {
7076
type: String,
71-
default: "",
77+
default: '',
7278
},
7379
ccuIcon: {
7480
type: String as PropType<typeof ICONS[keyof typeof ICONS]>,
75-
default: "",
81+
default: '',
7682
},
7783
iconSize: {
7884
type: String as PropType<IconSize>,
79-
default: "",
85+
default: '',
8086
},
8187
suffixIcon: {
8288
type: String as PropType<typeof ICONS[keyof typeof ICONS]>,
83-
default: "",
89+
default: '',
8490
},
8591
selector: {
8692
type: String,
87-
default: "",
93+
default: '',
8894
},
8995
variant: {
9096
type: String as PropType<typeof VARIANTS[keyof typeof VARIANTS]>,
91-
default: "",
97+
default: '',
9298
},
9399
type: {
94100
type: String,
95-
default: "",
101+
default: '',
96102
},
97103
},
98104
@@ -103,28 +109,28 @@ export default defineComponent({
103109
const buttonTitle = computed(() => props.text || props.alt || props.title);
104110
105111
const buttonSelector = computed(
106-
() => props.selector || `js-${kebabCase(buttonTitle.value)}`
112+
() => props.selector || `js-${kebabCase(buttonTitle.value)}`,
107113
);
108114
109115
const styles = computed(() => {
110116
const styleObject = {
111-
"large text-h3 font-h3": ["large", "lg"].includes(props.size),
112-
"medium text-sans text-h4 font-h4": ["medium", "md"].includes(
113-
props.size
117+
'large text-h3 font-h3': ['large', 'lg'].includes(props.size),
118+
'medium text-sans text-h4 font-h4': ['medium', 'md'].includes(
119+
props.size,
114120
),
115-
"small text-bodysm font-bodysm": ["small", "sm"].includes(props.size),
121+
'small text-bodysm font-bodysm': ['small', 'sm'].includes(props.size),
116122
disabled: props.disabled,
117123
// **** DEPRECATED ****
118-
primary: props.type === "primary",
119-
danger: props.type === "danger",
120-
warning: props.type === "warning",
121-
link: props.type === "link",
122-
bare: props.type === "bare",
124+
primary: props.type === 'primary',
125+
danger: props.type === 'danger',
126+
warning: props.type === 'warning',
127+
link: props.type === 'link',
128+
bare: props.type === 'bare',
123129
// **************
124130
flex: true,
125-
"items-center": true,
126-
"justify-center": true,
127-
"base-button": true,
131+
'items-center': true,
132+
'justify-center': true,
133+
'base-button': true,
128134
};
129135
if (props.variant) {
130136
styleObject[props.variant] = true;
@@ -135,7 +141,7 @@ export default defineComponent({
135141
136142
const timeout = async () => {
137143
await delay(5000);
138-
return Promise.reject();
144+
throw undefined;
139145
};
140146
141147
const performAction = async () => {
@@ -145,11 +151,9 @@ export default defineComponent({
145151
if (props.action) {
146152
await Promise.race([props.action(), timeout()]);
147153
}
148-
} catch (e) {
149-
// TODO: expose method for handling button exceptions
150154
} finally {
151-
// const { logEvent } = useLogEvent();
152-
// logEvent(props.ccuEvent);
155+
const { logEvent } = useLogEvent();
156+
logEvent(props.ccuEvent);
153157
loading.value = false;
154158
}
155159
};

‎src/components/BaseCheckbox.vue‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,13 @@
1717
</template>
1818
<script lang="ts">
1919
import { ref, defineComponent, onMounted } from 'vue';
20-
// import { EventsMixin } from '@/mixins';
21-
// import useLogEvent from '@/use/events/useLogEvent';
20+
import useLogEvent from '@/hooks/useLogEvent';
2221
2322
export default defineComponent({
2423
name: 'BaseCheckbox',
25-
// mixins: [EventsMixin],
2624
2725
setup(props, context) {
28-
// const { logEvent } = useLogEvent();
26+
const { logEvent } = useLogEvent();
2927
3028
const isInvalid = ref(false);
3129
const input = ref<HTMLInputElement | null>(null);
@@ -43,7 +41,7 @@ export default defineComponent({
4341
function update(e) {
4442
context.emit('update:modelValue', e.target.checked);
4543
isInvalid.value = input?.value?.checkValidity() || false;
46-
// logEvent(props.ccuEvent);
44+
logEvent(props.ccuEvent);
4745
}
4846
4947
function change(e) {

‎src/components/BaseIcon.vue‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,13 +33,11 @@
3333
import { kebabCase } from "lodash";
3434
import { computed, defineComponent, PropType, ref } from "vue";
3535
import { ICON_MAP, ICON_SIZES, ICONS } from "../constants";
36-
// import { EventsMixin } from '@/mixins';
3736
3837
type IconSize = typeof ICON_SIZES[number];
3938
4039
export default defineComponent({
4140
name: "BaseIcon",
42-
// mixins: [EventsMixin],
4341
4442
props: {
4543
type: {

‎src/components/OrganizationSearchInput.vue‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,21 @@
88
:delay="0"
99
:searchable="true"
1010
:object="true"
11-
:create-option="allowNew"
12-
:add-option-on="['enter', 'tab']"
1311
value-prop="id"
1412
:options="onOrganizationSearch"
13+
:clear-on-blur="false"
14+
@close="
15+
(select) => {
16+
const value = select.input.value;
17+
$nextTick(() => {
18+
if (!Number.isInteger(select.textValue) && allowNew) {
19+
$emit('input', value);
20+
}
21+
});
22+
}
23+
"
1524
@update:modelValue="
1625
(value) => {
17-
// TODO: Is there a way to do this without the click?
1826
if (Number.isInteger(value.id)) {
1927
$emit('selectedOrganization', value);
2028
} else {
@@ -26,6 +34,9 @@
2634
<template v-if="isAdmin" #option="{ option }">
2735
<span>{{ option.id }} - {{ option.name }}</span>
2836
</template>
37+
<template v-if="allowNew" #nooptions>
38+
<div></div>
39+
</template>
2940
</Multiselect>
3041
</template>
3142

@@ -91,6 +102,7 @@ export default defineComponent({
91102
92103
return {
93104
onOrganizationSearch,
105+
log: console.log,
94106
};
95107
},
96108
});

‎src/components/Table.vue‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -254,14 +254,13 @@
254254
</template>
255255

256256
<script lang="ts">
257-
// import { EventsMixin } from '@/mixins';
258257
import { computed, ref, defineComponent } from 'vue';
259258
import { useMq } from 'vue3-mq';
260259
import { exportCSVFile } from '../utils/downloads';
260+
import useLogEvent from '@/hooks/useLogEvent';
261261
262262
export default defineComponent({
263263
name: 'Table',
264-
// mixins: [EventsMixin], TODO: Events Mixin
265264
props: {
266265
columns: {
267266
type: Array,
@@ -495,9 +494,11 @@ export default defineComponent({
495494
...props.pagination,
496495
};
497496
const filter = {};
498-
// this.logEvent(
499-
// sorter.direction === 'asc' ? 'user_ui-sort-asc' : 'user_ui-sort-desc',
500-
// );
497+
const { logEvent } = useLogEvent();
498+
499+
logEvent(
500+
sorter.direction === 'asc' ? 'user_ui-sort-asc' : 'user_ui-sort-desc',
501+
);
501502
emit('change', { pagination, filter, sorter, columnSearch });
502503
}
503504
function onSearch() {

‎src/components/locations/LocationTool.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -281,7 +281,7 @@ import '@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';
281281
import * as circleToPolygon from 'circle-to-polygon';
282282
import * as turf from '@turf/turf';
283283
import { useStore } from 'vuex';
284-
import { throttle, cloneDeep } from 'lodash';
284+
import { throttle } from 'lodash';
285285
import { useRefHistory } from '@vueuse/core';
286286
import {
287287
reactive,
@@ -301,9 +301,8 @@ import LocationType from '../../models/LocationType';
301301
import useWorksiteMap from '../../hooks/worksite/useWorksiteMap';
302302
import LayerUploadTool from './LayerUploadTool.vue';
303303
import MapButton from './MapButton.vue';
304-
import { getMarkerLayer, mapAttribution, mapTileLayer } from '@/utils/map';
305304
import useCurrentUser from '@/hooks/useCurrentUser';
306-
import useRenderedMarkers from '@/hooks/worksite/useRenderedMarkers';
305+
import useLogEvent from '@/hooks/useLogEvent';
307306
308307
export default {
309308
name: 'LocationTool',
@@ -770,7 +769,8 @@ export default {
770769
nextTick(() => {
771770
showPopup(layer.getBounds().getCenter());
772771
});
773-
// this.logEvent('user_ui-draw');
772+
const { logEvent } = useLogEvent();
773+
logEvent('user_ui-draw');
774774
});
775775
776776
stateRefs.map.value = leafletMap;

‎src/hooks/useLogEvent.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import moment from 'moment';
2+
import { store } from '@/store';
3+
4+
export default () => {
5+
const logEvent = (eventKey: string) => {
6+
store.commit('events/addEvent', {
7+
event_key: eventKey,
8+
created_at: moment().toISOString(),
9+
});
10+
};
11+
12+
return {
13+
logEvent,
14+
};
15+
};

‎src/pages/Work.vue‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<template>
22
<div class="work-page h-full" :class="{ collapsedForm }">
3-
<!-- TODO: Move this (doesn't belong here) -->
43
<div class="work-page__main">
54
<div class="relative">
65
<div class="flex items-center justify-between">

0 commit comments

Comments
 (0)