-
-
Notifications
You must be signed in to change notification settings - Fork 18
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(devtools): more consistent Nuxt SEO UI
- Loading branch information
Showing
11 changed files
with
849 additions
and
583 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import { globalRefreshTime } from '../util/logic' | ||
|
||
export function fetchGlobalDebug() { | ||
return useAsyncData<{ | ||
nitroOrigin: string | ||
runtimeConfig: any | ||
}>(() => { | ||
return appFetch.value('/__schema-org__/debug.json') | ||
}, { | ||
watch: [globalRefreshTime], | ||
}) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,39 +1,28 @@ | ||
import type { Highlighter, Lang } from 'shiki-es' | ||
import { getHighlighter } from 'shiki-es' | ||
import { computed, ref, unref } from 'vue' | ||
import type { MaybeRef } from '@vueuse/core' | ||
import { devtools } from './rpc' | ||
import { ref } from 'vue' | ||
import { useColorMode } from '#imports' | ||
|
||
export const shiki = ref<Highlighter>() | ||
|
||
export function loadShiki() { | ||
// Only loading when needed | ||
return getHighlighter({ | ||
themes: [ | ||
'vitesse-dark', | ||
'vitesse-light', | ||
], | ||
langs: [ | ||
'css', | ||
'javascript', | ||
'typescript', | ||
'html', | ||
'vue', | ||
'vue-html', | ||
'bash', | ||
'diff', | ||
], | ||
}).then((i) => { | ||
shiki.value = i | ||
}) | ||
} | ||
// TODO: Only loading when needed | ||
getHighlighter({ | ||
themes: [ | ||
'vitesse-dark', | ||
'vitesse-light', | ||
], | ||
langs: [ | ||
'html', | ||
'json', | ||
], | ||
}).then((i) => { shiki.value = i }) | ||
|
||
export function renderCodeHighlight(code: MaybeRef<string>, lang?: Lang) { | ||
return computed(() => { | ||
const colorMode = devtools.value?.colorMode || 'light' | ||
return shiki.value!.codeToHtml(unref(code), { | ||
lang, | ||
theme: colorMode === 'dark' ? 'vitesse-dark' : 'vitesse-light', | ||
}) || '' | ||
export function highlight(code: string, lang: Lang) { | ||
const mode = useColorMode() | ||
if (!shiki.value) | ||
return code | ||
return shiki.value.codeToHtml(code, { | ||
lang, | ||
theme: mode.value === 'dark' ? 'vitesse-dark' : 'vitesse-light', | ||
}) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,17 +1,8 @@ | ||
import { ref } from 'vue' | ||
import type { ModuleRuntimeConfig } from 'nuxt-site-config' | ||
import { appFetch, unheadInstance } from './rpc' | ||
|
||
export const schemaOrgGraph = ref<any>(null) | ||
|
||
export const data = ref<{ | ||
nitroOrigin: string | ||
runtimeConfig: ModuleRuntimeConfig | ||
} | null>(null) | ||
|
||
export async function refreshSources() { | ||
schemaOrgGraph.value = (await unheadInstance.value!.resolveTags()) | ||
.filter(t => t.key === 'schema-org-graph')[0]?.innerHTML | ||
if (appFetch.value) | ||
data.value = await appFetch.value('/__schema-org__/debug.json') | ||
} | ||
// import {globalRefreshTime} from "~/client/util/logic"; | ||
// | ||
// | ||
// export async function refreshSources() { | ||
// schemaOrgGraph.value = (await unheadInstance.value!.resolveTags()) | ||
// .filter(t => t.key === 'schema-org-graph')[0]?.innerHTML | ||
// globalRefreshTime.value = Date.now() | ||
// } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import FloatingVue from 'floating-vue' | ||
import { defineNuxtPlugin } from '#imports' | ||
|
||
export default defineNuxtPlugin((nuxtApp) => { | ||
nuxtApp.vueApp.use(FloatingVue) | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import { computed, ref } from 'vue' | ||
import { useDebounceFn } from '@vueuse/core' | ||
import { withBase } from 'ufo' | ||
|
||
export const schemaOrgGraph = ref<any>(null) | ||
export const refreshTime = ref(Date.now()) | ||
export const globalRefreshTime = ref(Date.now()) | ||
export const hostname = window.location.host | ||
export const path = ref('/') | ||
export const query = ref() | ||
export const base = ref('/') | ||
|
||
export const refreshSources = useDebounceFn(() => { | ||
refreshTime.value = Date.now() | ||
}, 200) | ||
|
||
export const slowRefreshSources = useDebounceFn(() => { | ||
refreshTime.value = Date.now() | ||
}, 1000) | ||
|
||
export const host = computed(() => withBase(base.value, `${window.location.protocol}//${hostname}`)) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.