diff options
Diffstat (limited to 'packages/frontend/src/router.ts')
| -rw-r--r-- | packages/frontend/src/router.ts | 43 |
1 files changed, 11 insertions, 32 deletions
diff --git a/packages/frontend/src/router.ts b/packages/frontend/src/router.ts index fe9bc5938e..a4276ff4c0 100644 --- a/packages/frontend/src/router.ts +++ b/packages/frontend/src/router.ts @@ -4,7 +4,7 @@ import { $i, iAmModerator } from '@/account'; import MkLoading from '@/pages/_loading_.vue'; import MkError from '@/pages/_error_.vue'; -const page = (loader: AsyncComponentLoader<any>) => defineAsyncComponent({ +export const page = (loader: AsyncComponentLoader<any>) => defineAsyncComponent({ loader: loader, loadingComponent: MkLoading, errorComponent: MkError, @@ -202,6 +202,10 @@ export const routes = [{ path: '/about-misskey', component: page(() => import('./pages/about-misskey.vue')), }, { + path: '/invite', + name: 'invite', + component: page(() => import('./pages/invite.vue')), +}, { path: '/ads', component: page(() => import('./pages/ads.vue')), }, { @@ -429,6 +433,10 @@ export const routes = [{ name: 'server-rules', component: page(() => import('./pages/admin/server-rules.vue')), }, { + path: '/invites', + name: 'invites', + component: page(() => import('./pages/admin/invites.vue')), + }, { path: '/', component: page(() => import('./pages/_empty_.vue')), }], @@ -505,45 +513,16 @@ export const routes = [{ component: page(() => import('./pages/not-found.vue')), }]; -export const mainRouter = new Router(routes, location.pathname + location.search + location.hash); +export const mainRouter = new Router(routes, location.pathname + location.search + location.hash, !!$i, page(() => import('@/pages/not-found.vue'))); window.history.replaceState({ key: mainRouter.getCurrentKey() }, '', location.href); -// TODO: このファイルでスクロール位置も管理する設計だとdeckに対応できないのでなんとかする -// スクロール位置取得+スクロール位置設定関数をprovideする感じでも良いかも - -const scrollPosStore = new Map<string, number>(); - -window.setInterval(() => { - scrollPosStore.set(window.history.state?.key, window.scrollY); -}, 1000); - mainRouter.addListener('push', ctx => { window.history.pushState({ key: ctx.key }, '', ctx.path); - const scrollPos = scrollPosStore.get(ctx.key) ?? 0; - window.scroll({ top: scrollPos, behavior: 'instant' }); - if (scrollPos !== 0) { - window.setTimeout(() => { // 遷移直後はタイミングによってはコンポーネントが復元し切ってない可能性も考えられるため少し時間を空けて再度スクロール - window.scroll({ top: scrollPos, behavior: 'instant' }); - }, 100); - } -}); - -mainRouter.addListener('replace', ctx => { - window.history.replaceState({ key: ctx.key }, '', ctx.path); -}); - -mainRouter.addListener('same', () => { - window.scroll({ top: 0, behavior: 'smooth' }); }); window.addEventListener('popstate', (event) => { - mainRouter.replace(location.pathname + location.search + location.hash, event.state?.key, false); - const scrollPos = scrollPosStore.get(event.state?.key) ?? 0; - window.scroll({ top: scrollPos, behavior: 'instant' }); - window.setTimeout(() => { // 遷移直後はタイミングによってはコンポーネントが復元し切ってない可能性も考えられるため少し時間を空けて再度スクロール - window.scroll({ top: scrollPos, behavior: 'instant' }); - }, 100); + mainRouter.replace(location.pathname + location.search + location.hash, event.state?.key); }); export function useRouter(): Router { |