Skip to content

Commit 8877289

Browse files
authored
Merge pull request #351 from ava-labs/dev
posthog support
2 parents 5890f14 + bf8f6ca commit 8877289

File tree

16 files changed

+2525
-2208
lines changed

16 files changed

+2525
-2208
lines changed

.github/workflows/main.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ jobs:
4545
start: yarn serve --mode e2e
4646
wait-on: 'http://localhost:5000/'
4747
# wait for 3 minutes for the server to respond
48-
wait-on-timeout: 180
48+
wait-on-timeout: 300
4949
browser: chrome
5050
headless: true
5151

.gitignore

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,7 @@ yarn-error.log*
2424
*.sln
2525
*.sw?
2626
/cypress/videos
27-
/cypress/screenshots
27+
/cypress/screenshots
28+
29+
# Snyk
30+
.dccache

cypress/integration/basic_functionality.spec.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ const NETWORK_SWITCHER_BUTTON = '[data-cy="network-switcher"]'
55
describe('Basic Functionality', () => {
66
before(() => {
77
cy.visit('/')
8+
// Reject the analytics tracking
9+
cy.get('[data-cy="reject_analytics"]').click()
810
// Disable banner
911
cy.get('[data-cy="dismiss_banner"]').click()
1012
})

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"private": true,
44
"version": "0.1.4",
55
"engines": {
6-
"node": "15.x"
6+
"node": "15.x"
77
},
88
"scripts": {
99
"build": "vue-cli-service build",
@@ -75,6 +75,7 @@
7575
"luxon": "1.25.0",
7676
"moment": "2.29.4",
7777
"morgan": "1.9.1",
78+
"posthog-js": "1.32.2",
7879
"print-js": "1.0.63",
7980
"punycode": "2.1.1",
8081
"qr-scanner": "1.1.1",
@@ -128,7 +129,6 @@
128129
"eslint-plugin-import": "^2.22.1",
129130
"eslint-plugin-prettier-vue": "2.1.1",
130131
"eslint-plugin-vue": "^5.0.0",
131-
"fibers": "^4.0.2",
132132
"jest": "^26.1.0",
133133
"jest-environment-jsdom": "25",
134134
"node-sass": "^6.0.0",

src/App.vue

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,12 @@
1717
<LedgerWalletLoading></LedgerWalletLoading>
1818
<NetworkLoadingBlock></NetworkLoadingBlock>
1919
<notifications></notifications>
20+
<analytics></analytics>
2021
<TestNetBanner></TestNetBanner>
2122
</v-app>
2223
</template>
2324
<script>
25+
import Analytics from '@/components/Analytics/Analytics'
2426
import Notifications from '@/components/Notifications'
2527
import Navbar from './components/Navbar'
2628
import SaveAccountModal from '@/components/modals/SaveAccount/SaveAccountModal'
@@ -43,6 +45,7 @@ export default {
4345
SaveAccountModal,
4446
Navbar,
4547
Notifications,
48+
Analytics,
4649
TestNetBanner,
4750
},
4851
async created() {
Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
<template>
2+
<div class="analytics" v-show="showConsentModal">
3+
<div class="analytics_item">
4+
<p class="analytics_msg">
5+
{{ $t('analytics.cookie_desc') }}
6+
<a
7+
href="https://www.avalabs.org/privacy-policy"
8+
target="_blank"
9+
rel="noopener noreferrer"
10+
>
11+
{{ $t('analytics.privacy_policy') }}
12+
</a>
13+
.
14+
</p>
15+
<div class="analytics_actions">
16+
<button class="button_form_cancel" @click="onReject" data-cy="reject_analytics">
17+
{{ $t('analytics.reject') }}
18+
</button>
19+
<button class="button_primary" @click="onAccept">
20+
{{ $t('analytics.accept') }}
21+
</button>
22+
</div>
23+
</div>
24+
</div>
25+
</template>
26+
<script>
27+
export default {
28+
data() {
29+
return {
30+
// if the user never accepted or rejected, we show the prompt
31+
showConsentModal: localStorage.getItem('consentsToAnalytics') === null,
32+
}
33+
},
34+
computed: {},
35+
methods: {
36+
onAccept() {
37+
localStorage.setItem('consentsToAnalytics', true)
38+
// @ts-ignore
39+
this.$posthog.opt_in_capturing()
40+
this.showConsentModal = false
41+
42+
return
43+
},
44+
onReject() {
45+
localStorage.setItem('consentsToAnalytics', false)
46+
// @ts-ignore
47+
this.$posthog.opt_out_capturing()
48+
this.showConsentModal = false
49+
50+
return
51+
},
52+
},
53+
}
54+
</script>
55+
<style scoped>
56+
.analytics {
57+
position: fixed;
58+
display: flex;
59+
flex-direction: column;
60+
bottom: 0;
61+
right: 0;
62+
left: 0;
63+
padding: 30px 3vw;
64+
z-index: 9;
65+
}
66+
67+
.analytics_actions {
68+
display: flex;
69+
align-items: center;
70+
justify-content: flex-end;
71+
padding: 6px 14px;
72+
}
73+
74+
.analytics_item {
75+
border-radius: 6px;
76+
margin: auto;
77+
margin-bottom: 8px;
78+
overflow: hidden;
79+
box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.4);
80+
background-color: var(--bg);
81+
max-width: 295px;
82+
font-size: 13px !important;
83+
}
84+
85+
.button_form_cancel {
86+
margin-right: 16px !important;
87+
}
88+
89+
.button_primary {
90+
padding: 4px 8px;
91+
}
92+
93+
.analytics_msg {
94+
padding: 6px 14px;
95+
}
96+
97+
p {
98+
margin: 0 !important;
99+
}
100+
101+
@media only screen and (max-width: 600px) {
102+
.analytics {
103+
height: min-content;
104+
width: 100%;
105+
left: 0;
106+
top: 0;
107+
}
108+
109+
.analytics_item {
110+
max-width: unset;
111+
width: 100%;
112+
}
113+
}
114+
</style>

src/components/Navbar.vue

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,15 @@
2323
</template>
2424
<network-menu></network-menu>
2525
<LanguageSelect class="lang_web"></LanguageSelect>
26+
27+
<button @click="togglePopup">
28+
<fa icon="ellipsis-h"></fa>
29+
</button>
30+
<div class="popup-wrapper">
31+
<div class="popup" v-if="popupOpen">
32+
<AnalyticsCheckbox></AnalyticsCheckbox>
33+
</div>
34+
</div>
2635
</div>
2736

2837
<div class="mobile_right">
@@ -83,6 +92,7 @@
8392
import 'reflect-metadata'
8493
import { Vue, Component, Prop } from 'vue-property-decorator'
8594
import LanguageSelect from './misc/LanguageSelect/LanguageSelect.vue'
95+
import AnalyticsCheckbox from '@/components/wallet/sidebar/AnalyticsCheckbox.vue'
8696
import DayNightToggle from '@/components/misc/DayNightToggle.vue'
8797
import NetworkMenu from './NetworkSettings/NetworkMenu.vue'
8898
import ConfirmLogout from '@/components/modals/ConfirmLogout.vue'
@@ -93,11 +103,13 @@ import AccountMenu from '@/components/wallet/sidebar/AccountMenu.vue'
93103
NetworkMenu,
94104
DayNightToggle,
95105
ConfirmLogout,
106+
AnalyticsCheckbox,
96107
LanguageSelect,
97108
},
98109
})
99110
export default class Navbar extends Vue {
100111
isDrawer: boolean = false
112+
popupOpen: boolean = false
101113
102114
get isAuth(): boolean {
103115
return this.$store.state.isAuth
@@ -107,6 +119,10 @@ export default class Navbar extends Vue {
107119
// @ts-ignore
108120
this.$refs.logout.open()
109121
}
122+
123+
togglePopup(): void {
124+
this.popupOpen = !this.popupOpen
125+
}
110126
}
111127
</script>
112128
<style scoped lang="scss">
@@ -128,6 +144,23 @@ button {
128144
font-weight: normal;
129145
}
130146
147+
.popup-wrapper {
148+
position: relative;
149+
}
150+
151+
.popup {
152+
position: absolute;
153+
top: 18px;
154+
right: 0;
155+
padding: 8px;
156+
padding-bottom: 10px;
157+
box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.4);
158+
min-width: 280px;
159+
border: 1px solid var(--bg-light);
160+
background: var(--bg);
161+
border-radius: 3px;
162+
}
163+
131164
.daynight {
132165
margin-right: 15px;
133166
}

src/components/wallet/Sidebar.vue

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,17 +53,20 @@
5353
<div class="bottom">
5454
<AccountMenu class="wallet_link"></AccountMenu>
5555
<LanguageSelect></LanguageSelect>
56+
<AnalyticsCheckbox></AnalyticsCheckbox>
5657
</div>
5758
</div>
5859
</div>
5960
</template>
6061
<script>
6162
import LanguageSelect from '@/components/misc/LanguageSelect/LanguageSelect'
6263
import AccountMenu from '@/components/wallet/sidebar/AccountMenu'
64+
import AnalyticsCheckbox from '@/components/wallet/sidebar/AnalyticsCheckbox'
6365
export default {
6466
components: {
6567
AccountMenu,
6668
LanguageSelect,
69+
AnalyticsCheckbox,
6770
},
6871
}
6972
</script>
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<template>
2+
<div>
3+
<v-checkbox
4+
:label="label"
5+
v-model="value"
6+
@change="change"
7+
class="analytics-checkbox"
8+
></v-checkbox>
9+
</div>
10+
</template>
11+
<script>
12+
export default {
13+
data() {
14+
return {
15+
value: !!JSON.parse(localStorage.getItem('consentsToAnalytics')),
16+
}
17+
},
18+
props: {
19+
label: {
20+
type: String,
21+
default: 'Participate in CoreAnalytics',
22+
},
23+
},
24+
model: {
25+
prop: 'value',
26+
event: 'change',
27+
},
28+
methods: {
29+
onAccept() {
30+
localStorage.setItem('consentsToAnalytics', true)
31+
// @ts-ignore
32+
this.$posthog.opt_in_capturing()
33+
this.consentsToAnalytics = true
34+
this.$emit('change', this.value)
35+
36+
return
37+
},
38+
onReject() {
39+
localStorage.setItem('consentsToAnalytics', false)
40+
// @ts-ignore
41+
this.$posthog.opt_out_capturing()
42+
this.analyticsEnabled = false
43+
this.consentsToAnalytics = false
44+
this.$emit('change', this.value)
45+
46+
return
47+
},
48+
change() {
49+
if (this.value) {
50+
this.onAccept()
51+
} else {
52+
this.onReject()
53+
}
54+
},
55+
},
56+
}
57+
</script>
58+
59+
<style lang="scss">
60+
@use "../../../main";
61+
62+
.analytics-checkbox {
63+
margin-top: 0 !important;
64+
65+
.v-label {
66+
color: var(--primary-color);
67+
left: -4px !important;
68+
}
69+
70+
.v-input__slot {
71+
margin-bottom: 0;
72+
position: relative;
73+
left: -2px;
74+
}
75+
76+
.v-input--selection-controls__ripple {
77+
color: var(--secondary-color) !important;
78+
}
79+
80+
.v-messages {
81+
display: none;
82+
}
83+
84+
.v-input--selection-controls__input {
85+
> * {
86+
font-size: 18px !important;
87+
color: var(--primary-color) !important;
88+
}
89+
}
90+
}
91+
</style>

src/locales/en.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,12 @@
44
"private_key": "Private Key",
55
"address": "Address",
66
"add_pk": "Add Private Key",
7+
"analytics": {
8+
"accept": "Accept",
9+
"reject": "Reject",
10+
"privacy_policy": "Privacy Policy",
11+
"cookie_desc": "We use cookies to develop improvements and enhance your experience. To find out more, read our"
12+
},
713
"home": {
814
"desc": "Avalanche Wallet is a simple, secure, non-custodial wallet for storing Avalanche assets.",
915
"access": {

0 commit comments

Comments
 (0)