oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

refactor(frontend): router.ts解きほぐし (#12907)

Browse source 
* refactor(frontend): router.ts解きほぐし

* add debug hmr option

* fix comment

* fix not working

* add comment

* fix name

* Update definition.ts

---------

Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
This commit is contained in:
おさむのひと 2024-01-08 14:44:43 +09:00 • committed by GitHub
parent 0ed2a220f4
commit 04f9147db6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
49 changed files with 937 additions and 650 deletions
Download patch file Download diff file Expand all files Collapse all files

33
packages/frontend/src/components/MkPageWindow.vue
View file

@ -23,26 +23,26 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<div ref="contents" :class="$style.root" style="container-type: inline-size;">
<RouterView :key="reloadCount" :router="router"/>
<RouterView :key="reloadCount" :router="windowRouter"/>
</div>
</MkWindow>
</template>
<script lang="ts" setup>
import { ComputedRef, onMounted, onUnmounted, provide, shallowRef, ref, computed } from 'vue';
import { computed, ComputedRef, onMounted, onUnmounted, provide, ref, shallowRef } from 'vue';
import RouterView from '@/components/global/RouterView.vue';
import MkWindow from '@/components/MkWindow.vue';
import { popout as _popout } from '@/scripts/popout.js';
import copyToClipboard from '@/scripts/copy-to-clipboard.js';
import { url } from '@/config.js';
import { mainRouter, routes, page } from '@/router.js';
import { $i } from '@/account.js';
import { Router, useScrollPositionManager } from '@/nirax.js';
import { useScrollPositionManager } from '@/nirax.js';
import { i18n } from '@/i18n.js';
import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
import { openingWindowsCount } from '@/os.js';
import { claimAchievement } from '@/scripts/achievements.js';
import { getScrollContainer } from '@/scripts/scroll.js';
import { useRouterFactory } from '@/global/router/supplier.js';
import { mainRouter } from '@/global/router/main.js';
const props = defineProps<{
initialPath: string;
@ -52,14 +52,15 @@ defineEmits<{
(ev: 'closed'): void;
}>();
const router = new Router(routes, props.initialPath, !!$i, page(() => import('@/pages/not-found.vue')));
const routerFactory = useRouterFactory();
const windowRouter = routerFactory(props.initialPath);
const contents = shallowRef<HTMLElement>();
const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
const windowEl = shallowRef<InstanceType<typeof MkWindow>>();
const history = ref<{ path: string; key: any; }[]>([{
path: router.getCurrentPath(),
key: router.getCurrentKey(),
path: windowRouter.getCurrentPath(),
key: windowRouter.getCurrentKey(),
}]);
const buttonsLeft = computed(() => {
const buttons = [];
@ -88,11 +89,11 @@ const buttonsRight = computed(() => {
});
const reloadCount = ref(0);
router.addListener('push', ctx => {
windowRouter.addListener('push', ctx => {
history.value.push({ path: ctx.path, key: ctx.key });
});
provide('router', router);
provide('router', windowRouter);
provideMetadataReceiver((info) => {
pageMetadata.value = info;
});
@ -112,20 +113,20 @@ const contextmenu = computed(() => ([{
icon: 'ti ti-external-link',
text: i18n.ts.openInNewTab,
action: () => {
window.open(url + router.getCurrentPath(), '_blank', 'noopener');
window.open(url + windowRouter.getCurrentPath(), '_blank', 'noopener');
windowEl.value.close();
},
}, {
icon: 'ti ti-link',
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(url + router.getCurrentPath());
copyToClipboard(url + windowRouter.getCurrentPath());
},
}]));
function back() {
history.value.pop();
router.replace(history.value.at(-1)!.path, history.value.at(-1)!.key);
windowRouter.replace(history.value.at(-1)!.path, history.value.at(-1)!.key);
}
function reload() {
@ -137,16 +138,16 @@ function close() {
}
function expand() {
mainRouter.push(router.getCurrentPath(), 'forcePage');
mainRouter.push(windowRouter.getCurrentPath(), 'forcePage');
windowEl.value.close();
}
function popout() {
_popout(router.getCurrentPath(), windowEl.value.$el);
_popout(windowRouter.getCurrentPath(), windowEl.value.$el);
windowEl.value.close();
}
useScrollPositionManager(() => getScrollContainer(contents.value), router);
useScrollPositionManager(() => getScrollContainer(contents.value), windowRouter);
onMounted(() => {
openingWindowsCount.value++;