Skip to content

Commit 8a37586

Browse files
authored
fix: Correct vue version docs url on vue link (#11)
1 parent f4b2216 commit 8a37586

File tree

1 file changed

+106
-49
lines changed

1 file changed

+106
-49
lines changed

src/popup/App.vue

Lines changed: 106 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -13,38 +13,78 @@
1313
target="_blank"
1414
class="mr-3"
1515
>
16-
<AppButton size="small" appearance="primary" outlined>Open</AppButton>
16+
<AppButton size="small" appearance="primary" outlined>
17+
Open
18+
</AppButton>
1719
</a>
18-
<AppButton v-else-if="isRootUrl && showcase && showcase.hasVue && !showcase.isPublic && !savingError" @click.native="saveShowcase" size="small" appearance="primary" class="mr-3">{{ saving ? 'Saving...' : 'Save' }}</AppButton>
20+
<AppButton
21+
v-else-if="
22+
isRootUrl &&
23+
showcase &&
24+
showcase.hasVue &&
25+
!showcase.isPublic &&
26+
!savingError
27+
"
28+
@click.native="saveShowcase"
29+
size="small"
30+
appearance="primary"
31+
class="mr-3"
32+
>
33+
{{ saving ? 'Saving...' : 'Save' }}
34+
</AppButton>
1935

20-
<a href="https://twitter.com/VueTelescope" target="_blank" class="mr-3">
36+
<a
37+
href="https://twitter.com/VueTelescope"
38+
target="_blank"
39+
class="mr-3"
40+
>
2141
<TwitterIcon class="w-5 h-5 hover:text-primary-500" />
2242
</a>
2343

24-
<a href="https://github.com/nuxt-company/vue-telescope-analyzer" target="_blank">
44+
<a
45+
href="https://github.com/nuxt-company/vue-telescope-analyzer"
46+
target="_blank"
47+
>
2548
<GithubIcon class="w-5 h-5 hover:text-primary-500" />
2649
</a>
2750
</div>
2851
</div>
2952

3053
<!-- <div v-if="isLoading && (!showcase || !showcase.url)">Please refresh the page to detect.</div> -->
3154

32-
<div v-if="isLoading" class="absolute top-0 left-0 flex items-center justify-center w-full h-full">
55+
<div
56+
v-if="isLoading"
57+
class="absolute top-0 left-0 flex items-center justify-center w-full h-full"
58+
>
3359
<div class="font-bold-body-weight text-seven">Loading...</div>
3460
</div>
3561

36-
<div v-else-if="!showcase || !showcase.url" class="absolute top-0 left-0 flex items-center justify-center w-full h-full">
37-
<div class="font-bold-body-weight text-eight">Please enter an url in the address bar.</div>
62+
<div
63+
v-else-if="!showcase || !showcase.url"
64+
class="absolute top-0 left-0 flex items-center justify-center w-full h-full"
65+
>
66+
<div class="font-bold-body-weight text-eight">
67+
Please enter an url in the address bar.
68+
</div>
3869
</div>
3970

4071
<div v-else-if="showcase">
4172
<div v-if="showcase.hasVue">
4273
<div class="mb-8">
4374
<div v-if="savingError" class="mb-4 text-orange">
44-
Could not save website to Vue Telescope, please try again later or <a class="underline" :href="`mailto:[email protected]?subject=Could not save ${showcase.url}`">contact us</a>.
75+
Could not save website to Vue Telescope, please try again later or
76+
<a
77+
class="underline"
78+
:href="
79+
`mailto:[email protected]?subject=Could not save ${showcase.url}`
80+
"
81+
>contact us</a
82+
>.
4583
</div>
4684
<div class="mb-4">
47-
<h3 class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500">
85+
<h3
86+
class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500"
87+
>
4888
<InfoIcon class="h-5 mr-2 opacity-50 text-primary-5700" />Info
4989
</h3>
5090
</div>
@@ -53,15 +93,11 @@
5393
<ExploreDataItem
5494
label="Vue Version"
5595
tag="a"
56-
href="https://vuejs.org"
96+
:href="vueDocsURL"
5797
target="_blank"
5898
rel="noreferrer noopener"
5999
>
60-
<img
61-
class="w-6 h-6 mr-2"
62-
:src="iconURL('/vue.svg')"
63-
alt
64-
/>
100+
<img class="w-6 h-6 mr-2" :src="iconURL('/vue.svg')" alt />
65101
<div class="text-base leading-base font-bold-body-weight">
66102
{{ showcase.vueVersion }}
67103
</div>
@@ -112,7 +148,9 @@
112148
</ExploreDataItem>
113149

114150
<ExploreDataItem
115-
v-if="showcase.framework && showcase.framework.slug === 'nuxtjs'"
151+
v-if="
152+
showcase.framework && showcase.framework.slug === 'nuxtjs'
153+
"
116154
label="Deployment"
117155
>
118156
<div
@@ -126,8 +164,12 @@
126164

127165
<div v-if="showcase.plugins.length" class="mb-4">
128166
<div class="mb-4">
129-
<h3 class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500">
130-
<PluginsIcon class="h-6 mr-2 opacity-50 text-primary-500" />Plugins
167+
<h3
168+
class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500"
169+
>
170+
<PluginsIcon
171+
class="h-6 mr-2 opacity-50 text-primary-500"
172+
/>Plugins
131173
</h3>
132174
</div>
133175

@@ -139,19 +181,20 @@
139181
target="_blank"
140182
class="mb-4 mr-4 border bg-grey-50 hover:bg-grey-100 border-grey-200 rounded-xl"
141183
>
142-
<span
143-
class="block px-4 py-2 text-sm font-bold-body-weight"
144-
>
145-
{{ plugin.name }}
146-
</span>
184+
<span class="block px-4 py-2 text-sm font-bold-body-weight">{{
185+
plugin.name
186+
}}</span>
147187
</a>
148188
</div>
149189
</div>
150190

151191
<div v-if="showcase.modules.length">
152192
<div class="mb-4">
153-
<h3 class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500">
154-
<ModulesIcon class="h-6 mr-2 opacity-50 text-primary-500" />Nuxt Modules
193+
<h3
194+
class="flex items-center pl-2 uppercase font-bold-body-weight text-primary-500"
195+
>
196+
<ModulesIcon class="h-6 mr-2 opacity-50 text-primary-500" />Nuxt
197+
Modules
155198
</h3>
156199
</div>
157200

@@ -163,21 +206,23 @@
163206
target="_blank"
164207
class="mb-4 mr-4 border bg-grey-50 hover:bg-grey-100 border-grey-200 rounded-xl"
165208
>
166-
<span
167-
class="block px-4 py-2 text-sm font-bold-body-weight"
168-
>
169-
{{ module.name }}
170-
</span>
209+
<span class="block px-4 py-2 text-sm font-bold-body-weight">{{
210+
module.name
211+
}}</span>
171212
</a>
172213
</div>
173214
</div>
174215
</div>
175216

176-
<div v-else-if="!showcase.hasVue" class="absolute top-0 left-0 flex items-center justify-center w-full h-full pointer-events-none ">
177-
<div class="font-bold-body-weight text-eight">Vue is not used on this website</div>
217+
<div
218+
v-else-if="!showcase.hasVue"
219+
class="absolute top-0 left-0 flex items-center justify-center w-full h-full pointer-events-none"
220+
>
221+
<div class="font-bold-body-weight text-eight">
222+
Vue is not used on this website
223+
</div>
178224
</div>
179225
</div>
180-
181226
</div>
182227
</div>
183228
</template>
@@ -199,7 +244,7 @@ import AppButton from '../components/AppButton.vue'
199244
200245
export default {
201246
components: {
202-
// // ExternalLinkIcon,
247+
// // ExternalLinkIcon,
203248
LogoIcon,
204249
TwitterIcon,
205250
GithubIcon,
@@ -225,11 +270,21 @@ export default {
225270
return false
226271
}
227272
const { hostname } = new URL(this.showcase.url)
228-
if (this.showcase.url.endsWith(hostname) || this.showcase.url.endsWith(hostname + '/')) {
273+
if (
274+
this.showcase.url.endsWith(hostname) ||
275+
this.showcase.url.endsWith(hostname + '/')
276+
) {
229277
return true
230278
} else {
231279
return false
232280
}
281+
},
282+
vueDocsURL () {
283+
return (
284+
(this.showcase.vueVersion.startsWith('1') && 'https://v1.vuejs.org') ||
285+
(this.showcase.vueVersion.startsWith('2') && 'https://vuejs.org') ||
286+
(this.showcase.vueVersion.startsWith('3') && 'https://v3.vuejs.org')
287+
)
233288
}
234289
},
235290
mounted () {
@@ -263,20 +318,22 @@ export default {
263318
this.isLoading = false
264319
this.showcase = res.payload || null
265320
266-
// this.sendToContent({
267-
// proxyTo: 'injected',
268-
// from: 'popup',
269-
// payload: 'test from popup'
270-
// })
321+
// this.sendToContent({
322+
// proxyTo: 'injected',
323+
// from: 'popup',
324+
// payload: 'test from popup'
325+
// })
271326
},
272327
async getCurrentTab () {
273-
return await browser.tabs.query({ currentWindow: true, active: true }).then((tabsArray) => {
274-
const { id, status, url } = tabsArray[0]
275-
if (status === 'complete') {
276-
return { id, url }
277-
}
278-
return null
279-
})
328+
return await browser.tabs
329+
.query({ currentWindow: true, active: true })
330+
.then(tabsArray => {
331+
const { id, status, url } = tabsArray[0]
332+
if (status === 'complete') {
333+
return { id, url }
334+
}
335+
return null
336+
})
280337
},
281338
sendToBackground (message) {
282339
return browser.runtime.sendMessage(message)
@@ -300,9 +357,9 @@ export default {
300357
return
301358
}
302359
const sse = new EventSource(
303-
`https://service.vuetelescope.com?url=${this.showcase.url}&isPublic=true`
360+
`https://service.vuetelescope.com?url=${this.showcase.url}&isPublic=true`
304361
)
305-
sse.addEventListener('message', (event) => {
362+
sse.addEventListener('message', event => {
306363
try {
307364
const res = JSON.parse(event.data)
308365
if (!res.error && !res.isAdultContent) {

0 commit comments

Comments
 (0)