valaxy 0.14.7 → 0.14.9

package/client/components/ValaxyMd.vue

@@ -1,15 +1,19 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue'
-import { inject, onMounted, ref } from 'vue'
+import { computed, inject, onMounted, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAplayer, useCodePen, useCopyCode, useMediumZoom, wrapTable } from 'valaxy'
 import type { Post } from 'valaxy'
 
+import dayjs from 'dayjs'
+import relativeTime from 'dayjs/plugin/relativeTime'
 const props = defineProps<{
   frontmatter: Post
   excerpt?: string
 }>()
 
+dayjs.extend(relativeTime)
+
 const onContentUpdated = inject('onContentUpdated') as Ref<() => void>
 
 const { t } = useI18n()
@@ -35,11 +39,26 @@ useCopyCode()
 
 if (typeof props.frontmatter.medium_zoom === 'undefined' || props.frontmatter.medium_zoom)
   useMediumZoom()
+
+/**
+ * when the post is updated more than 30 days ago, show a warning
+ * default 30 days, you can set `time_warning` in frontmatter to change it
+ */
+const time_warning = computed(() => {
+  const diff = dayjs().valueOf() - dayjs(props.frontmatter.updated).valueOf()
+  if (typeof props.frontmatter.time_warning === 'number')
+    return diff > props.frontmatter.time_warning
+  else
+    return props.frontmatter.time_warning || diff > 30 * 24 * 60 * 60 * 1000
+})
 </script>
 
 <template>
   <Transition appear>
     <article v-if="$slots.default" :class="frontmatter.markdown !== false && 'markdown-body'">
+      <blockquote v-if="time_warning" op="80">
+        {{ t('post.time_warning', { ago: dayjs(frontmatter.updated).fromNow() }) }}
+      </blockquote>
       <slot ref="content" @vnode-updated="updateDom" />
 
       <div text="center">

package/client/composables/common.ts

@@ -2,7 +2,7 @@ import { useRoute } from 'vue-router'
 import { computed, inject } from 'vue'
 import { isClient } from '@vueuse/core'
 
-import type { PageData, Post } from '../..'
+import type { PageData, Post } from 'valaxy/types'
 import { useSiteConfig } from '../config'
 
 export function useFrontmatter() {

package/client/composables/locale.ts

@@ -1,9 +1,12 @@
 import { isClient, useStorage } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
+import dayjs from 'dayjs'
+import 'dayjs/locale/zh-cn'
 
 export const useLocale = () => {
   const { availableLocales, locale } = useI18n()
   const lang = useStorage('valaxy-locale', locale.value)
+  dayjs.locale(lang.value.toLowerCase())
 
   const toggleLocales = () => {
     // change to some real logic
@@ -13,6 +16,9 @@ export const useLocale = () => {
     // for localStorage
     lang.value = locale.value
 
+    // set dayjs locale
+    dayjs.locale(lang.value.toLowerCase())
+
     if (isClient)
       document.documentElement.setAttribute('lang', locale.value)
   }

package/client/composables/post.ts

@@ -26,7 +26,7 @@ export function usePageList() {
       .filter(i => i.meta.frontmatter)
       .filter(i => i.path && !excludePages.includes(i.path))
       .map((i) => {
-        return Object.assign({ path: i.path, excerpt: i.meta.excerpt }, i.meta.frontmatter)
+        return Object.assign({ path: i.path, excerpt: i.meta.excerpt }, i.meta.frontmatter) as Post
       })
     return routes
   })

package/client/locales/en.yml

@@ -45,6 +45,7 @@ post:
   view_link: View link
   read_more: READ MORE
   cover: Cover
+  time_warning: This article was last updated {ago}. The information described in this article may have changed.
   copyright:
     author: Post author
     link: Post link

package/client/locales/zh-CN.yml

@@ -45,6 +45,7 @@ post:
   view_link: 查看链接
   read_more: 阅读更多
   cover: 封面
+  time_warning: 本文最后更新于 {ago}，文中所描述的信息可能已发生改变。
   copyright:
     author: 本文作者
     link: 本文链接

package/client/modules/valaxy.ts

@@ -11,14 +11,12 @@ import { createI18n } from 'vue-i18n'
 import { useStorage } from '@vueuse/core'
 
 import type { Router } from 'vue-router'
-import type { PageDataPayload } from '../../types'
-import { initValaxyConfig, valaxyConfigSymbol } from '../config'
 import { ensureSuffix } from '@antfu/utils'
-
 import type { UserModule } from 'valaxy/client/types'
-
+import type { PageDataPayload } from '../../types'
+import { initValaxyConfig, valaxyConfigSymbol } from '../config'
 // @ts-expect-error virtual
-import messages from '/@valaxyjs/locales'
+import valaxyMessages from '/@valaxyjs/locales'
 
 // Import i18n resources
 // https://vitejs.dev/guide/features.html#glob-import
@@ -54,7 +52,7 @@ export const install: UserModule = ({ app, router }) => {
   const i18n = createI18n({
     legacy: false,
     locale: locale.value,
-    messages,
+    messages: valaxyMessages,
   })
   app.use(i18n)