sim1222/test1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactor: use Vite to build instead of webpack (#8575)

Browse Source 
* update stream.ts

* https://github.com/misskey-dev/misskey/pull/7769#issuecomment-917542339

* fix lint

* clean up?

* add app

* fix

* nanka iroiro

* wip

* wip

* fix lint

* fix loginId

* fix

* refactor

* refactor

* remove follow action

* clean up

* Revert "remove follow action"

This reverts commit defbb416480905af2150d1c92f10d8e1d1288c0a.

* Revert "clean up"

This reverts commit f94919cb9cff41e274044fc69c56ad36a33974f2.

* remove fetch specification

* renoteの条件追加

* apiFetch => cli

* bypass fetch?

* fix

* refactor: use path alias

* temp: add submodule

* remove submodule

* enhane: unison-reloadに指定したパスに移動できるように

* null

* null

* feat: ログインするアカウントのIDをクエリ文字列で指定する機能

* null

* await?

* rename

* rename

* Update read.ts

* merge

* get-note-summary

* fix

* swパッケージに

* add missing packages

* fix getNoteSummary

* add webpack-cli

* ✌️

* remove plugins

* sw-inject分離したがテストしてない

* fix notification.vue

* remove a blank line

* disconnect intersection observer

* disconnect2

* fix notification.vue

* remove a blank line

* disconnect intersection observer

* disconnect2

* fix

* ✌️

* clean up config

* typesを戻した

* Update packages/client/src/components/notification.vue

Co-authored-by: Acid Chicken (硫酸鶏) <root@acid-chicken.com>

* disconnect

* oops

* Failed to load the script unexpectedly回避
sw.jsとlib.tsを分離してみた

* truncate notification

* Update packages/client/src/ui/_common_/common.vue

Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>

* clean up

* clean up

* キャッシュ対策

* Truncate push notification message

* クライアントがあったらストリームに接続しているということなので通知しない判定の位置を修正

* components/drive-file-thumbnail.vue

* components/drive-select-dialog.vue

* components/drive-window.vue

* merge

* fix

* Service Workerのビルドにesbuildを使うようにする

* return createEmptyNotification()

* fix

* i18n.ts

* update

* ✌️

* remove ts-loader

* fix

* fix

* enhance: Service Workerを常に登録するように

* pollEnded

* URLをsw.jsに戻す

* clean up

* wip

* wip

* wip

* wip

* wip

* wip

* ✌️

* use import

* fix

* install rollup

* use defineAsyncComponent.

* fix emojilist

* wip use defineAsyncComponent

* popup(import -> popup(defineAsyncComponent(() => import

* draggable?

* fix init import

* clean up

* fix router

* add comment

* ✌️

* ✌️

* ✌️

* remove webpack

* update vite

* fix boot sequence

* Revert "fix boot sequence"

This reverts commit e893dbf37aed83bf9f12e427d98c78a7065b4a39.

* revert boot import

* never make two app div

* ;

* remove console.log

* change clientEntry sequence

* fix

* Revert "fix"

This reverts commit 12741b3d89950a31dbb1bb81477ddb27b0e9951a.

* fix

* add comment https://github.com/misskey-dev/misskey/pull/8575#issuecomment-1114239210

* add log

* add comment

Co-authored-by: Acid Chicken (硫酸鶏) <root@acid-chicken.com>
Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
This commit is contained in:
tamaina
2022-05-01 22:51:07 +09:00
committed by GitHub
parent 6ed010b192
commit a89003b57a
66 changed files with 548 additions and 2280 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/client/src/account.ts
View File

@ -1,5 +1,5 @@
import { del, get, set } from '@/scripts/idb-proxy';
import { reactive } from 'vue';
import { defineAsyncComponent, reactive } from 'vue';
import * as misskey from 'misskey-js';
import { apiUrl } from '@/config';
import { waiting, api, popup, popupMenu, success, alert } from '@/os';
@ -141,7 +141,7 @@ export async function openAccountMenu(opts: {
onChoose?: (account: misskey.entities.UserDetailed) => void;
}, ev: MouseEvent) {
function showSigninDialog() {
popup(import('@/components/signin-dialog.vue'), {}, {
popup(defineAsyncComponent(() => import('@/components/signin-dialog.vue')), {}, {
done: res => {
addAccount(res.id, res.i);
success();
@ -150,7 +150,7 @@ export async function openAccountMenu(opts: {
}
function createAccount() {
popup(import('@/components/signup-dialog.vue'), {}, {
popup(defineAsyncComponent(() => import('@/components/signup-dialog.vue')), {}, {
done: res => {
addAccount(res.id, res.i);
switchAccountWithToken(res.i);

8
packages/client/src/components/abuse-report.vue
View File

@ -43,20 +43,20 @@ export default defineComponent({
MkSwitch,
},
emits: ['resolved'],
props: {
report: {
type: Object,
required: true,
}
}
},
emits: ['resolved'],
data() {
return {
forward: this.report.forwarded,
};
}
},
methods: {
acct,

2
packages/client/src/components/analog-clock.vue
View File

@ -42,7 +42,7 @@
<script lang="ts" setup>
import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
withDefaults(defineProps<{
thickness: number;

12
packages/client/src/components/chart.vue
View File

@ -29,7 +29,9 @@ import {
import 'chartjs-adapter-date-fns';
import { enUS } from 'date-fns/locale';
import zoomPlugin from 'chartjs-plugin-zoom';
import gradient from 'chartjs-plugin-gradient';
// https://github.com/misskey-dev/misskey/pull/8575#issuecomment-1114242002
// We can't use gradient because Vite throws a error.
//import gradient from 'chartjs-plugin-gradient';
import * as os from '@/os';
import { defaultStore } from '@/store';
import MkChartTooltip from '@/components/chart-tooltip.vue';
@ -50,7 +52,7 @@ Chart.register(
SubTitle,
Filler,
zoomPlugin,
gradient,
//gradient,
);
const sum = (...arr) => arr.reduce((r, a) => r.map((b, i) => a[i] + b));
@ -221,7 +223,7 @@ export default defineComponent({
borderJoinStyle: 'round',
borderRadius: props.bar ? 3 : undefined,
backgroundColor: props.bar ? (x.color ? x.color : getColor(i)) : alpha(x.color ? x.color : getColor(i), 0.1),
gradient: props.bar ? undefined : {
/*gradient: props.bar ? undefined : {
backgroundColor: {
axis: 'y',
colors: {
@ -229,7 +231,7 @@ export default defineComponent({
[maxes[i]]: alpha(x.color ? x.color : getColor(i), 0.2),
},
},
},
},*/
barPercentage: 0.9,
categoryPercentage: 0.9,
fill: x.type === 'area',
@ -340,7 +342,7 @@ export default defineComponent({
},
}
} : undefined,
gradient,
//gradient,
},
},
plugins: [{

4
packages/client/src/components/drive.file.vue
View File

@ -31,7 +31,7 @@
</template>
<script lang="ts" setup>
import { computed, ref } from 'vue';
import { computed, defineAsyncComponent, ref } from 'vue';
import * as Misskey from 'misskey-js';
import copyToClipboard from '@/scripts/copy-to-clipboard';
import MkDriveFileThumbnail from './drive-file-thumbnail.vue';
@ -133,7 +133,7 @@ function rename() {
}
function describe() {
os.popup(import('@/components/media-caption.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/media-caption.vue')), {
title: i18n.ts.describeFile,
input: {
placeholder: i18n.ts.inputNewDescription,

4
packages/client/src/components/drive.folder.vue
View File

@ -27,7 +27,7 @@
</template>
<script lang="ts" setup>
import { computed, ref } from 'vue';
import { computed, defineAsyncComponent, ref } from 'vue';
import * as Misskey from 'misskey-js';
import * as os from '@/os';
import { i18n } from '@/i18n';
@ -230,7 +230,7 @@ function onContextmenu(ev: MouseEvent) {
text: i18n.ts.openInWindow,
icon: 'fas fa-window-restore',
action: () => {
os.popup(import('./drive-window.vue'), {
os.popup(defineAsyncComponent(() => import('./drive-window.vue')), {
initialFolder: props.folder
}, {
}, 'closed');

2
packages/client/src/components/emoji-picker.vue
View File

@ -61,7 +61,7 @@
</div>
<div>
<header class="_acrylic">{{ i18n.ts.emoji }}</header>
<XSection v-for="category in categories" :emojis="emojilist.filter(e => e.category === category).map(e => e.char)" @chosen="chosen">{{ category }}</XSection>
<XSection v-for="category in categories" :key="category" :emojis="emojilist.filter(e => e.category === category).map(e => e.char)" @chosen="chosen">{{ category }}</XSection>
</div>
</div>
<div class="tabs">

4
packages/client/src/components/form/range.vue
View File

@ -16,7 +16,7 @@
</template>
<script lang="ts">
import { computed, defineComponent, onMounted, onUnmounted, ref, watch } from 'vue';
import { computed, defineAsyncComponent, defineComponent, onMounted, onUnmounted, ref, watch } from 'vue';
import * as os from '@/os';
export default defineComponent({
@ -112,7 +112,7 @@ export default defineComponent({
ev.preventDefault();
const tooltipShowing = ref(true);
os.popup(import('@/components/ui/tooltip.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/ui/tooltip.vue')), {
showing: tooltipShowing,
text: computed(() => {
return props.textConverter(finalValue.value);

2
packages/client/src/components/global/header.vue
View File

@ -38,7 +38,7 @@
<script lang="ts">
import { computed, defineComponent, onMounted, onUnmounted, PropType, ref, inject } from 'vue';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
import { popupMenu } from '@/os';
import { url } from '@/config';
import { scrollToTop } from '@/scripts/scroll';

4
packages/client/src/components/global/url.vue
View File

@ -18,7 +18,7 @@
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
import { defineAsyncComponent, defineComponent, ref } from 'vue';
import { toUnicode as decodePunycode } from 'punycode/';
import { url as local } from '@/config';
import * as os from '@/os';
@ -50,7 +50,7 @@ export default defineComponent({
const el = ref();
useTooltip(el, (showing) => {
os.popup(import('@/components/url-preview-popup.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/url-preview-popup.vue')), {
showing,
url: props.url,
source: el.value,

4
packages/client/src/components/link.vue
View File

@ -8,7 +8,7 @@
</template>
<script lang="ts" setup>
import { } from 'vue';
import { defineAsyncComponent } from 'vue';
import { url as local } from '@/config';
import { useTooltip } from '@/scripts/use-tooltip';
import * as os from '@/os';
@ -26,7 +26,7 @@ const target = self ? null : '_blank';
const el = $ref();
useTooltip($$(el), (showing) => {
os.popup(import('@/components/url-preview-popup.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/url-preview-popup.vue')), {
showing,
url: props.url,
source: el,

2
packages/client/src/components/mention.vue
View File

@ -16,7 +16,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
import { toUnicode } from 'punycode';
import { host as localHost } from '@/config';
import { $i } from '@/account';

2
packages/client/src/components/post-form-attaches.vue
View File

@ -88,7 +88,7 @@ export default defineComponent({
},
async describe(file) {
os.popup(import("@/components/media-caption.vue"), {
os.popup(defineAsyncComponent(() => import("@/components/media-caption.vue")), {
title: this.$ts.describeFile,
input: {
placeholder: this.$ts.inputNewDescription,

4
packages/client/src/components/post-form.vue
View File

@ -62,7 +62,7 @@
</template>
<script lang="ts" setup>
import { inject, watch, nextTick, onMounted } from 'vue';
import { inject, watch, nextTick, onMounted, defineAsyncComponent } from 'vue';
import * as mfm from 'mfm-js';
import * as misskey from 'misskey-js';
import insertTextAtCursor from 'insert-text-at-cursor';
@ -384,7 +384,7 @@ function setVisibility() {
return;
}
os.popup(import('./visibility-picker.vue'), {
os.popup(defineAsyncComponent(() => import('./visibility-picker.vue')), {
currentVisibility: visibility,
currentLocalOnly: localOnly,
src: visibilityButton,

4
packages/client/src/components/signin.vue
View File

@ -46,7 +46,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import { toUnicode } from 'punycode/';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
@ -224,7 +224,7 @@ export default defineComponent({
},
resetPassword() {
os.popup(import('@/components/forgot-password.vue'), {}, {
os.popup(defineAsyncComponent(() => import('@/components/forgot-password.vue')), {}, {
}, 'closed');
}
}

2
packages/client/src/components/signup.vue
View File

@ -67,7 +67,7 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent } from 'vue';
const getPasswordStrength = require('syuilo-password-strength');
const getPasswordStrength = await import('syuilo-password-strength');
import { toUnicode } from 'punycode/';
import { host, url } from '@/config';
import MkButton from './ui/button.vue';

2
packages/client/src/components/ui/folder.vue
View File

@ -23,7 +23,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
const localStoragePrefix = 'ui:folder:';

2
packages/client/src/components/widgets.vue
View File

@ -37,7 +37,7 @@ import { widgets as widgetDefs } from '@/widgets';
export default defineComponent({
components: {
XDraggable: defineAsyncComponent(() => import('vuedraggable').then(x => x.default)),
XDraggable: defineAsyncComponent(() => import('vuedraggable')),
MkSelect,
MkButton,
},

4
packages/client/src/directives/tooltip.ts
View File

@ -1,7 +1,7 @@
// TODO: useTooltip関数使うようにしたい
// ただディレクティブ内でonUnmountedなどのcomposition api使えるのか不明
import { Directive, ref } from 'vue';
import { defineAsyncComponent, Directive, ref } from 'vue';
import { isTouchUsing } from '@/scripts/touch';
import { popup, alert } from '@/os';
@ -45,7 +45,7 @@ export default {
if (self.text == null) return;
const showing = ref(true);
popup(import('@/components/ui/tooltip.vue'), {
popup(defineAsyncComponent(() => import('@/components/ui/tooltip.vue')), {
showing,
text: self.text,
targetElement: el,

4
packages/client/src/directives/user-preview.ts
View File

@ -1,4 +1,4 @@
import { Directive, ref } from 'vue';
import { defineAsyncComponent, Directive, ref } from 'vue';
import autobind from 'autobind-decorator';
import { popup } from '@/os';
@ -24,7 +24,7 @@ export class UserPreview {
const showing = ref(true);
popup(import('@/components/user-preview.vue'), {
popup(defineAsyncComponent(() => import('@/components/user-preview.vue')), {
showing,
q: this.user,
source: this.el

42
packages/client/src/init.ts
View File

@ -13,9 +13,9 @@ if (localStorage.getItem('accounts') != null) {
}
//#endregion
import { computed, createApp, watch, markRaw, version as vueVersion } from 'vue';
import { computed, createApp, watch, markRaw, version as vueVersion, defineAsyncComponent } from 'vue';
import compareVersions from 'compare-versions';
import * as JSON5 from 'json5';
import JSON5 from 'json5';
import widgets from '@/widgets';
import directives from '@/directives';
@ -168,14 +168,14 @@ fetchInstanceMetaPromise.then(() => {
initializeSw();
});
const app = createApp(await (
window.location.search === '?zen' ? import('@/ui/zen.vue') :
!$i ? import('@/ui/visitor.vue') :
ui === 'deck' ? import('@/ui/deck.vue') :
ui === 'desktop' ? import('@/ui/desktop.vue') :
ui === 'classic' ? import('@/ui/classic.vue') :
import('@/ui/universal.vue')
).then(x => x.default));
const app = createApp(
window.location.search === '?zen' ? defineAsyncComponent(() => import('@/ui/zen.vue')) :
!$i ? defineAsyncComponent(() => import('@/ui/visitor.vue')) :
ui === 'deck' ? defineAsyncComponent(() => import('@/ui/deck.vue')) :
ui === 'desktop' ? defineAsyncComponent(() => import('@/ui/desktop.vue')) :
ui === 'classic' ? defineAsyncComponent(() => import('@/ui/classic.vue')) :
defineAsyncComponent(() => import('@/ui/universal.vue'))
);
if (_DEV_) {
app.config.performance = true;
@ -203,8 +203,24 @@ if (splash) splash.addEventListener('transitionend', () => {
splash.remove();
});
const rootEl = document.createElement('div');
document.body.appendChild(rootEl);
// https://github.com/misskey-dev/misskey/pull/8575#issuecomment-1114239210
// なぜかinit.tsの内容が2回実行されることがあるため、mountするdivを1つに制限する
const rootEl = (() => {
const MISSKEY_MOUNT_DIV_ID = 'misskey_app';
const currentEl = document.getElementById(MISSKEY_MOUNT_DIV_ID);
if (currentEl) {
console.warn('multiple import detected');
return currentEl;
}
const rootEl = document.createElement('div');
rootEl.id = MISSKEY_MOUNT_DIV_ID;
document.body.appendChild(rootEl);
return rootEl;
})();
app.mount(rootEl);
// boot.jsのやつを解除
@ -230,7 +246,7 @@ if (lastVersion !== version) {
if (lastVersion != null && compareVersions(version, lastVersion) === 1) {
// ログインしてる場合だけ
if ($i) {
popup(import('@/components/updated.vue'), {}, {}, 'closed');
popup(defineAsyncComponent(() => import('@/components/updated.vue')), {}, {}, 'closed');
}
}
} catch (e) {

47
packages/client/src/os.ts
View File

@ -110,10 +110,6 @@ export function promiseDialog<T extends Promise<any>>(
return promise;
}
function isModule(x: any): x is typeof import('*.vue') {
return x.default != null;
}
let popupIdCount = 0;
export const popups = ref([]) as Ref<{
id: any;
@ -131,10 +127,7 @@ export function claimZIndex(priority: 'low' | 'middle' | 'high' = 'low'): number
return zIndexes[priority];
}
export async function popup(component: Component | typeof import('*.vue') | Promise<Component | typeof import('*.vue')>, props: Record<string, any>, events = {}, disposeEvent?: string) {
if (component.then) component = await component;
if (isModule(component)) component = component.default;
export async function popup(component: Component, props: Record<string, any>, events = {}, disposeEvent?: string) {
markRaw(component);
const id = ++popupIdCount;
@ -163,7 +156,7 @@ export async function popup(component: Component | typeof import('*.vue') | Prom
export function pageWindow(path: string) {
const { component, props } = resolve(path);
popup(import('@/components/page-window.vue'), {
popup(defineAsyncComponent(() => import('@/components/page-window.vue')), {
initialPath: path,
initialComponent: markRaw(component),
initialProps: props,
@ -172,7 +165,7 @@ export function pageWindow(path: string) {
export function modalPageWindow(path: string) {
const { component, props } = resolve(path);
popup(import('@/components/modal-page-window.vue'), {
popup(defineAsyncComponent(() => import('@/components/modal-page-window.vue')), {
initialPath: path,
initialComponent: markRaw(component),
initialProps: props,
@ -180,7 +173,7 @@ export function modalPageWindow(path: string) {
}
export function toast(message: string) {
popup(import('@/components/toast.vue'), {
popup(defineAsyncComponent(() => import('@/components/toast.vue')), {
message
}, {}, 'closed');
}
@ -191,7 +184,7 @@ export function alert(props: {
text?: string | null;
}): Promise<void> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), props, {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), props, {
done: result => {
resolve();
},
@ -205,7 +198,7 @@ export function confirm(props: {
text?: string | null;
}): Promise<{ canceled: boolean }> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
...props,
showCancelButton: true,
}, {
@ -226,7 +219,7 @@ export function inputText(props: {
canceled: false; result: string;
}> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
title: props.title,
text: props.text,
input: {
@ -251,7 +244,7 @@ export function inputNumber(props: {
canceled: false; result: number;
}> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
title: props.title,
text: props.text,
input: {
@ -276,7 +269,7 @@ export function inputDate(props: {
canceled: false; result: Date;
}> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
title: props.title,
text: props.text,
input: {
@ -313,7 +306,7 @@ export function select<C extends any = any>(props: {
canceled: false; result: C;
}> {
return new Promise((resolve, reject) => {
popup(import('@/components/dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
title: props.title,
text: props.text,
select: {
@ -335,7 +328,7 @@ export function success() {
window.setTimeout(() => {
showing.value = false;
}, 1000);
popup(import('@/components/waiting-dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
success: true,
showing: showing
}, {
@ -347,7 +340,7 @@ export function success() {
export function waiting() {
return new Promise((resolve, reject) => {
const showing = ref(true);
popup(import('@/components/waiting-dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
success: false,
showing: showing
}, {
@ -358,7 +351,7 @@ export function waiting() {
export function form(title, form) {
return new Promise((resolve, reject) => {
popup(import('@/components/form-dialog.vue'), { title, form }, {
popup(defineAsyncComponent(() => import('@/components/form-dialog.vue')), { title, form }, {
done: result => {
resolve(result);
},
@ -368,7 +361,7 @@ export function form(title, form) {
export async function selectUser() {
return new Promise((resolve, reject) => {
popup(import('@/components/user-select-dialog.vue'), {}, {
popup(defineAsyncComponent(() => import('@/components/user-select-dialog.vue')), {}, {
ok: user => {
resolve(user);
},
@ -378,7 +371,7 @@ export async function selectUser() {
export async function selectDriveFile(multiple: boolean) {
return new Promise((resolve, reject) => {
popup(import('@/components/drive-select-dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
type: 'file',
multiple
}, {
@ -393,7 +386,7 @@ export async function selectDriveFile(multiple: boolean) {
export async function selectDriveFolder(multiple: boolean) {
return new Promise((resolve, reject) => {
popup(import('@/components/drive-select-dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
type: 'folder',
multiple
}, {
@ -408,7 +401,7 @@ export async function selectDriveFolder(multiple: boolean) {
export async function pickEmoji(src: HTMLElement | null, opts) {
return new Promise((resolve, reject) => {
popup(import('@/components/emoji-picker-dialog.vue'), {
popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
src,
...opts
}, {
@ -458,7 +451,7 @@ export async function openEmojiPicker(src?: HTMLElement, opts, initialTextarea:
characterData: false,
});
openingEmojiPicker = await popup(import('@/components/emoji-picker-window.vue'), {
openingEmojiPicker = await popup(defineAsyncComponent(() => import('@/components/emoji-picker-window.vue')), {
src,
...opts
}, {
@ -480,7 +473,7 @@ export function popupMenu(items: MenuItem[] | Ref<MenuItem[]>, src?: HTMLElement
}) {
return new Promise((resolve, reject) => {
let dispose;
popup(import('@/components/ui/popup-menu.vue'), {
popup(defineAsyncComponent(() => import('@/components/ui/popup-menu.vue')), {
items,
src,
width: options?.width,
@ -501,7 +494,7 @@ export function contextMenu(items: MenuItem[] | Ref<MenuItem[]>, ev: MouseEvent)
ev.preventDefault();
return new Promise((resolve, reject) => {
let dispose;
popup(import('@/components/ui/context-menu.vue'), {
popup(defineAsyncComponent(() => import('@/components/ui/context-menu.vue')), {
items,
ev,
}, {

4
packages/client/src/pages/admin/emojis.vue
View File

@ -63,7 +63,7 @@
</template>
<script lang="ts" setup>
import { computed, defineComponent, ref, toRef } from 'vue';
import { computed, defineAsyncComponent, defineComponent, ref, toRef } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkPagination from '@/components/ui/pagination.vue';
@ -130,7 +130,7 @@ const add = async (ev: MouseEvent) => {
};
const edit = (emoji) => {
os.popup(import('./emoji-edit-dialog.vue'), {
os.popup(defineAsyncComponent(() => import('./emoji-edit-dialog.vue')), {
emoji: emoji
}, {
done: result => {

4
packages/client/src/pages/admin/files.vue
View File

@ -55,7 +55,7 @@
</template>
<script lang="ts" setup>
import { computed } from 'vue';
import { computed, defineAsyncComponent } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
@ -93,7 +93,7 @@ function clear() {
}
function show(file) {
os.popup(import('./file-dialog.vue'), {
os.popup(defineAsyncComponent(() => import('./file-dialog.vue')), {
fileId: file.id
}, {}, 'closed');
}

4
packages/client/src/pages/api-console.vue
View File

@ -26,8 +26,8 @@
</template>
<script lang="ts" setup>
import { defineExpose, ref } from 'vue';
import * as JSON5 from 'json5';
import { ref } from 'vue';
import JSON5 from 'json5';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkTextarea from '@/components/form/textarea.vue';

4
packages/client/src/pages/reset-password.vue
View File

@ -12,7 +12,7 @@
</template>
<script lang="ts" setup>
import { onMounted } from 'vue';
import { defineAsyncComponent, onMounted } from 'vue';
import FormInput from '@/components/form/input.vue';
import FormButton from '@/components/ui/button.vue';
import * as os from '@/os';
@ -36,7 +36,7 @@ async function save() {
onMounted(() => {
if (props.token == null) {
os.popup(import('@/components/forgot-password.vue'), {}, {}, 'closed');
os.popup(defineAsyncComponent(() => import('@/components/forgot-password.vue')), {}, {}, 'closed');
router.push('/');
}
});

6
packages/client/src/pages/settings/accounts.vue
View File

@ -21,7 +21,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import FormSuspense from '@/components/form/suspense.vue';
import FormButton from '@/components/ui/button.vue';
import * as os from '@/os';
@ -78,7 +78,7 @@ export default defineComponent({
},
addExistingAccount() {
os.popup(import('@/components/signin-dialog.vue'), {}, {
os.popup(defineAsyncComponent(() => import('@/components/signin-dialog.vue')), {}, {
done: res => {
addAccount(res.id, res.i);
os.success();
@ -87,7 +87,7 @@ export default defineComponent({
},
createAccount() {
os.popup(import('@/components/signup-dialog.vue'), {}, {
os.popup(defineAsyncComponent(() => import('@/components/signup-dialog.vue')), {}, {
done: res => {
addAccount(res.id, res.i);
this.switchAccountWithToken(res.i);

4
packages/client/src/pages/settings/api.vue
View File

@ -7,7 +7,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import FormLink from '@/components/form/link.vue';
import FormButton from '@/components/ui/button.vue';
import * as os from '@/os';
@ -34,7 +34,7 @@ export default defineComponent({
methods: {
generateToken() {
os.popup(import('@/components/token-generate-window.vue'), {}, {
os.popup(defineAsyncComponent(() => import('@/components/token-generate-window.vue')), {}, {
done: async result => {
const { name, permissions } = result;
const { token } = await os.api('miauth/gen-token', {

2
packages/client/src/pages/settings/drive.vue
View File

@ -35,7 +35,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
import FormLink from '@/components/form/link.vue';
import FormSwitch from '@/components/form/switch.vue';
import FormSection from '@/components/form/section.vue';

4
packages/client/src/pages/settings/notifications.vue
View File

@ -10,7 +10,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import FormButton from '@/components/ui/button.vue';
import FormLink from '@/components/form/link.vue';
import FormSection from '@/components/form/section.vue';
@ -52,7 +52,7 @@ export default defineComponent({
configure() {
const includingTypes = notificationTypes.filter(x => !this.$i.mutingNotificationTypes.includes(x));
os.popup(import('@/components/notification-setting-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
includingTypes,
showGlobalToggle: false,
}, {

4
packages/client/src/pages/settings/plugin.install.vue
View File

@ -13,7 +13,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import { AiScript, parse } from '@syuilo/aiscript';
import { serialize } from '@syuilo/aiscript/built/serializer';
import { v4 as uuid } from 'uuid';
@ -94,7 +94,7 @@ export default defineComponent({
}
const token = permissions == null || permissions.length === 0 ? null : await new Promise((res, rej) => {
os.popup(import('@/components/token-generate-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/token-generate-window.vue')), {
title: this.$ts.tokenRequested,
information: this.$ts.pluginTokenRequestedDescription,
initialName: name,

4
packages/client/src/pages/settings/reaction.vue
View File

@ -54,7 +54,7 @@
</template>
<script lang="ts" setup>
import { watch } from 'vue';
import { defineAsyncComponent, watch } from 'vue';
import XDraggable from 'vuedraggable';
import FormInput from '@/components/form/input.vue';
import FormRadios from '@/components/form/radios.vue';
@ -88,7 +88,7 @@ function remove(reaction, ev: MouseEvent) {
}
function preview(ev: MouseEvent) {
os.popup(import('@/components/emoji-picker-dialog.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
asReactionPicker: true,
src: ev.currentTarget ?? ev.target,
}, {}, 'closed');

2
packages/client/src/pages/settings/theme.install.vue
View File

@ -13,7 +13,7 @@
<script lang="ts" setup>
import { } from 'vue';
import * as JSON5 from 'json5';
import JSON5 from 'json5';
import FormTextarea from '@/components/form/textarea.vue';
import FormButton from '@/components/ui/button.vue';
import { applyTheme, validateTheme } from '@/scripts/theme';

2
packages/client/src/pages/settings/theme.manage.vue
View File

@ -27,7 +27,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import * as JSON5 from 'json5';
import JSON5 from 'json5';
import FormTextarea from '@/components/form/textarea.vue';
import FormSelect from '@/components/form/select.vue';
import FormInput from '@/components/form/input.vue';

2
packages/client/src/pages/settings/theme.vue
View File

@ -87,7 +87,7 @@
<script lang="ts">
import { computed, defineComponent, onActivated, onMounted, ref, watch } from 'vue';
import * as JSON5 from 'json5';
import JSON5 from 'json5';
import FormSwitch from '@/components/form/switch.vue';
import FormSelect from '@/components/form/select.vue';
import FormGroup from '@/components/form/group.vue';

4
packages/client/src/pages/theme-editor.vue
View File

@ -67,9 +67,9 @@
<script lang="ts" setup>
import { watch } from 'vue';
import { toUnicode } from 'punycode/';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
import { v4 as uuid} from 'uuid';
import * as JSON5 from 'json5';
import JSON5 from 'json5';
import FormButton from '@/components/ui/button.vue';
import FormTextarea from '@/components/form/textarea.vue';

2
packages/client/src/pages/user/index.vue
View File

@ -125,7 +125,7 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent, computed } from 'vue';
import * as age from 's-age';
import age from 's-age';
import XUserTimeline from './index.timeline.vue';
import XNote from '@/components/note.vue';
import MkFollowButton from '@/components/follow-button.vue';

51
packages/client/src/router.ts
View File

@ -1,4 +1,4 @@
import { defineAsyncComponent, markRaw } from 'vue';
import { AsyncComponentLoader, defineAsyncComponent, markRaw } from 'vue';
import { createRouter, createWebHistory } from 'vue-router';
import MkLoading from '@/pages/_loading_.vue';
import MkError from '@/pages/_error_.vue';
@ -6,8 +6,9 @@ import MkTimeline from '@/pages/timeline.vue';
import { $i, iAmModerator } from './account';
import { ui } from '@/config';
const page = (path: string, ui?: string) => defineAsyncComponent({
loader: ui ? () => import(`./ui/${ui}/pages/${path}.vue`) : () => import(`./pages/${path}.vue`),
// pathに/が入るとrollupが解決してくれないので、() => import('*.vue')を指定すること
const page = (path: string | AsyncComponentLoader<any>, uiName?: string) => defineAsyncComponent({
loader: typeof path === 'string' ? uiName ? () => import(`./ui/${ui}/pages/${path}.vue`) : () => import(`./pages/${path}.vue`) : path,
loadingComponent: MkLoading,
errorComponent: MkError,
});
@ -17,10 +18,10 @@ let indexScrollPos = 0;
const defaultRoutes = [
// NOTE: MkTimelineをdynamic importするとAsyncComponentWrapperが間に入るせいでkeep-aliveのコンポーネント指定が効かなくなる
{ path: '/', name: 'index', component: $i ? MkTimeline : page('welcome') },
{ path: '/@:acct/:page?', name: 'user', component: page('user/index'), props: route => ({ acct: route.params.acct, page: route.params.page || 'index' }) },
{ path: '/@:acct/:page?', name: 'user', component: page(() => import('./pages/user/index.vue')), props: route => ({ acct: route.params.acct, page: route.params.page || 'index' }) },
{ path: '/@:user/pages/:page', component: page('page'), props: route => ({ pageName: route.params.page, username: route.params.user }) },
{ path: '/@:user/pages/:pageName/view-source', component: page('page-editor/page-editor'), props: route => ({ initUser: route.params.user, initPageName: route.params.pageName }) },
{ path: '/settings/:page(.*)?', name: 'settings', component: page('settings/index'), props: route => ({ initialPage: route.params.page || null }) },
{ path: '/@:user/pages/:pageName/view-source', component: page(() => import('./pages/page-editor/page-editor.vue')), props: route => ({ initUser: route.params.user, initPageName: route.params.pageName }) },
{ path: '/settings/:page(.*)?', name: 'settings', component: page(() => import('./pages/settings/index.vue')), props: route => ({ initialPage: route.params.page || null }) },
{ path: '/reset-password/:token?', component: page('reset-password'), props: route => ({ token: route.params.token }) },
{ path: '/signup-complete/:code', component: page('signup-complete'), props: route => ({ code: route.params.code }) },
{ path: '/announcements', component: page('announcements') },
@ -35,12 +36,12 @@ const defaultRoutes = [
{ path: '/emojis', component: page('emojis') },
{ path: '/search', component: page('search'), props: route => ({ query: route.query.q, channel: route.query.channel }) },
{ path: '/pages', name: 'pages', component: page('pages') },
{ path: '/pages/new', component: page('page-editor/page-editor') },
{ path: '/pages/edit/:pageId', component: page('page-editor/page-editor'), props: route => ({ initPageId: route.params.pageId }) },
{ path: '/gallery', component: page('gallery/index') },
{ path: '/gallery/new', component: page('gallery/edit') },
{ path: '/gallery/:postId/edit', component: page('gallery/edit'), props: route => ({ postId: route.params.postId }) },
{ path: '/gallery/:postId', component: page('gallery/post'), props: route => ({ postId: route.params.postId }) },
{ path: '/pages/new', component: page(() => import('./pages/page-editor/page-editor.vue')) },
{ path: '/pages/edit/:pageId', component: page(() => import('./pages/page-editor/page-editor.vue')), props: route => ({ initPageId: route.params.pageId }) },
{ path: '/gallery', component: page(() => import('./pages/gallery/index.vue')) },
{ path: '/gallery/new', component: page(() => import('./pages/gallery/edit.vue')) },
{ path: '/gallery/:postId/edit', component: page(() => import('./pages/gallery/edit.vue')), props: route => ({ postId: route.params.postId }) },
{ path: '/gallery/:postId', component: page(() => import('./pages/gallery/edit.vue')), props: route => ({ postId: route.params.postId }) },
{ path: '/channels', component: page('channels') },
{ path: '/channels/new', component: page('channel-editor') },
{ path: '/channels/:channelId/edit', component: page('channel-editor'), props: true },
@ -52,23 +53,23 @@ const defaultRoutes = [
{ path: '/my/favorites', component: page('favorites') },
{ path: '/my/messages', component: page('messages') },
{ path: '/my/mentions', component: page('mentions') },
{ path: '/my/messaging', name: 'messaging', component: page('messaging/index') },
{ path: '/my/messaging/:user', component: page('messaging/messaging-room'), props: route => ({ userAcct: route.params.user }) },
{ path: '/my/messaging/group/:group', component: page('messaging/messaging-room'), props: route => ({ groupId: route.params.group }) },
{ path: '/my/messaging', name: 'messaging', component: page(() => import('./pages/messaging/index.vue')) },
{ path: '/my/messaging/:user', component: page(() => import('./pages/messaging/messaging-room.vue')), props: route => ({ userAcct: route.params.user }) },
{ path: '/my/messaging/group/:group', component: page(() => import('./pages/messaging/messaging-room.vue')), props: route => ({ groupId: route.params.group }) },
{ path: '/my/drive', name: 'drive', component: page('drive') },
{ path: '/my/drive/folder/:folder', component: page('drive') },
{ path: '/my/follow-requests', component: page('follow-requests') },
{ path: '/my/lists', component: page('my-lists/index') },
{ path: '/my/lists/:list', component: page('my-lists/list') },
{ path: '/my/groups', component: page('my-groups/index') },
{ path: '/my/groups/:group', component: page('my-groups/group'), props: route => ({ groupId: route.params.group }) },
{ path: '/my/antennas', component: page('my-antennas/index') },
{ path: '/my/antennas/create', component: page('my-antennas/create') },
{ path: '/my/antennas/:antennaId', component: page('my-antennas/edit'), props: true },
{ path: '/my/clips', component: page('my-clips/index') },
{ path: '/my/lists', component: page(() => import('./pages/my-lists/index.vue')) },
{ path: '/my/lists/:list', component: page(() => import('./pages/my-lists/list.vue')) },
{ path: '/my/groups', component: page(() => import('./pages/my-groups/index.vue')) },
{ path: '/my/groups/:group', component: page(() => import('./pages/my-groups/group.vue')), props: route => ({ groupId: route.params.group }) },
{ path: '/my/antennas', component: page(() => import('./pages/my-antennas/index.vue')) },
{ path: '/my/antennas/create', component: page(() => import('./pages/my-antennas/create.vue')) },
{ path: '/my/antennas/:antennaId', component: page(() => import('./pages/my-antennas/edit.vue')), props: true },
{ path: '/my/clips', component: page(() => import('./pages/my-clips/index.vue')) },
{ path: '/scratchpad', component: page('scratchpad') },
{ path: '/admin/:page(.*)?', component: iAmModerator ? page('admin/index') : page('not-found'), props: route => ({ initialPage: route.params.page || null }) },
{ path: '/admin', component: iAmModerator ? page('admin/index') : page('not-found') },
{ path: '/admin/:page(.*)?', component: iAmModerator ? page(() => import('./pages/admin/index.vue')) : page('not-found'), props: route => ({ initialPage: route.params.page || null }) },
{ path: '/admin', component: iAmModerator ? page(() => import('./pages/admin/index.vue')) : page('not-found') },
{ path: '/notes/:note', name: 'note', component: page('note'), props: route => ({ noteId: route.params.note }) },
{ path: '/tags/:tag', component: page('tag'), props: route => ({ tag: route.params.tag }) },
{ path: '/user-info/:user', component: page('user-info'), props: route => ({ userId: route.params.user }) },

6
packages/client/src/scripts/autocomplete.ts
View File

@ -1,5 +1,5 @@
import { nextTick, Ref, ref } from 'vue';
import * as getCaretCoordinates from 'textarea-caret';
import { nextTick, Ref, ref, defineAsyncComponent } from 'vue';
import getCaretCoordinates from 'textarea-caret';
import { toASCII } from 'punycode/';
import { popup } from '@/os';
@ -157,7 +157,7 @@ export class Autocomplete {
const _y = ref(y);
const _q = ref(q);
const { dispose } = await popup(import('@/components/autocomplete.vue'), {
const { dispose } = await popup(defineAsyncComponent(() => import('@/components/autocomplete.vue')), {
textarea: this.textarea,
close: this.close,
type: type,

2
packages/client/src/scripts/emojilist.ts
View File

@ -8,4 +8,4 @@ export type UnicodeEmojiDef = {
}
// initial converted from https://github.com/muan/emojilib/commit/242fe68be86ed6536843b83f7e32f376468b38fb
export const emojilist = require('../emojilist.json') as UnicodeEmojiDef[];
export const emojilist = (await import('../emojilist.json')).default as UnicodeEmojiDef[];

4
packages/client/src/scripts/get-note-menu.ts
View File

@ -1,4 +1,4 @@
import { Ref } from 'vue';
import { defineAsyncComponent, Ref } from 'vue';
import * as misskey from 'misskey-js';
import { $i } from '@/account';
import { i18n } from '@/i18n';
@ -253,7 +253,7 @@ export function getNoteMenu(props: {
text: i18n.ts.reportAbuse,
action: () => {
const u = appearNote.url || appearNote.uri || `${url}/notes/${appearNote.id}`;
os.popup(import('@/components/abuse-report-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/abuse-report-window.vue')), {
user: appearNote.user,
initialComment: `Note: ${u}\n-----\n`
}, {}, 'closed');

3
packages/client/src/scripts/get-user-menu.ts
View File

@ -6,6 +6,7 @@ import * as os from '@/os';
import { userActions } from '@/store';
import { router } from '@/router';
import { $i, iAmModerator } from '@/account';
import { defineAsyncComponent } from 'vue';
export function getUserMenu(user) {
const meId = $i ? $i.id : null;
@ -127,7 +128,7 @@ export function getUserMenu(user) {
}
function reportAbuse() {
os.popup(import('@/components/abuse-report-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/abuse-report-window.vue')), {
user: user,
}, {}, 'closed');
}

4
packages/client/src/scripts/hpml/lib.ts
View File

@ -1,9 +1,9 @@
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
import { Hpml } from './evaluator';
import { values, utils } from '@syuilo/aiscript';
import { Fn, HpmlScope } from '.';
import { Expr } from './expr';
import * as seedrandom from 'seedrandom';
import seedrandom from 'seedrandom';
/* TODO: https://www.chartjs.org/docs/latest/configuration/canvas-background.html#color
// https://stackoverflow.com/questions/38493564/chart-area-background-color-chartjs

4
packages/client/src/scripts/reaction-picker.ts
View File

@ -1,4 +1,4 @@
import { Ref, ref } from 'vue';
import { defineAsyncComponent, Ref, ref } from 'vue';
import { popup } from '@/os';
class ReactionPicker {
@ -12,7 +12,7 @@ class ReactionPicker {
}
public async init() {
await popup(import('@/components/emoji-picker-dialog.vue'), {
await popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
src: this.src,
asReactionPicker: true,
manualShowing: this.manualShowing

38
packages/client/src/scripts/theme.ts
View File

@ -1,5 +1,5 @@
import { globalEvents } from '@/events';
import * as tinycolor from 'tinycolor2';
import tinycolor from 'tinycolor2';
export type Theme = {
id: string;
@ -10,29 +10,29 @@ export type Theme = {
props: Record<string, string>;
};
export const lightTheme: Theme = require('@/themes/_light.json5');
export const darkTheme: Theme = require('@/themes/_dark.json5');
export const lightTheme: Theme = await import('@/themes/_light.json5');
export const darkTheme: Theme = await import('@/themes/_dark.json5');
export const themeProps = Object.keys(lightTheme.props).filter(key => !key.startsWith('X'));
export const builtinThemes = [
require('@/themes/l-light.json5'),
require('@/themes/l-coffee.json5'),
require('@/themes/l-apricot.json5'),
require('@/themes/l-rainy.json5'),
require('@/themes/l-vivid.json5'),
require('@/themes/l-cherry.json5'),
require('@/themes/l-sushi.json5'),
await import('@/themes/l-light.json5'),
await import('@/themes/l-coffee.json5'),
await import('@/themes/l-apricot.json5'),
await import('@/themes/l-rainy.json5'),
await import('@/themes/l-vivid.json5'),
await import('@/themes/l-cherry.json5'),
await import('@/themes/l-sushi.json5'),
require('@/themes/d-dark.json5'),
require('@/themes/d-persimmon.json5'),
require('@/themes/d-astro.json5'),
require('@/themes/d-future.json5'),
require('@/themes/d-botanical.json5'),
require('@/themes/d-cherry.json5'),
require('@/themes/d-ice.json5'),
require('@/themes/d-pumpkin.json5'),
require('@/themes/d-black.json5'),
await import('@/themes/d-dark.json5'),
await import('@/themes/d-persimmon.json5'),
await import('@/themes/d-astro.json5'),
await import('@/themes/d-future.json5'),
await import('@/themes/d-botanical.json5'),
await import('@/themes/d-cherry.json5'),
await import('@/themes/d-ice.json5'),
await import('@/themes/d-pumpkin.json5'),
await import('@/themes/d-black.json5'),
] as Theme[];
let timeout = null;

7
packages/client/src/store.ts
View File

@ -255,10 +255,13 @@ type Plugin = {
/**
* 常にメモリにロードしておく必要がないような設定情報を保管するストレージ(非リアクティブ)
*/
import lightTheme from '@/themes/l-light.json5';
import darkTheme from '@/themes/d-dark.json5'
export class ColdDeviceStorage {
public static default = {
lightTheme: require('@/themes/l-light.json5') as Theme,
darkTheme: require('@/themes/d-dark.json5') as Theme,
lightTheme,
darkTheme,
syncDeviceDarkMode: true,
plugins: [] as Plugin[],
mediaVolume: 0.5,

2
packages/client/src/ui/_common_/common.vue
View File

@ -39,7 +39,7 @@ export default defineComponent({
id: notification.id
});
popup(import('@/components/notification-toast.vue'), {
popup(defineAsyncComponent(() => import('@/components/notification-toast.vue')), {
notification
}, {}, 'closed');
}

4
packages/client/src/ui/_common_/sidebar-for-mobile.vue
View File

@ -33,7 +33,7 @@
</template>
<script lang="ts">
import { computed, defineComponent, ref, toRef, watch } from 'vue';
import { computed, defineAsyncComponent, defineComponent, ref, toRef, watch } from 'vue';
import { host } from '@/config';
import { search } from '@/scripts/search';
import * as os from '@/os';
@ -67,7 +67,7 @@ export default defineComponent({
}, ev);
},
more: () => {
os.popup(import('@/components/launch-pad.vue'), {}, {
os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {}, {
}, 'closed');
},
};

4
packages/client/src/ui/_common_/sidebar.vue
View File

@ -33,7 +33,7 @@
</template>
<script lang="ts" setup>
import { computed, ref, watch } from 'vue';
import { computed, defineAsyncComponent, ref, watch } from 'vue';
import * as os from '@/os';
import { menuDef } from '@/menu';
import { $i, openAccountMenu as openAccountMenu_ } from '@/account';
@ -69,7 +69,7 @@ function openAccountMenu(ev: MouseEvent) {
}
function more(ev: MouseEvent) {
os.popup(import('@/components/launch-pad.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
src: ev.currentTarget ?? ev.target,
}, {
}, 'closed');

4
packages/client/src/ui/classic.header.vue
View File

@ -39,7 +39,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import { host } from '@/config';
import { search } from '@/scripts/search';
import * as os from '@/os';
@ -101,7 +101,7 @@ export default defineComponent({
},
more(ev) {
os.popup(import('@/components/launch-pad.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
src: ev.currentTarget ?? ev.target,
anchor: { x: 'center', y: 'bottom' },
}, {

4
packages/client/src/ui/classic.sidebar.vue
View File

@ -41,7 +41,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent } from 'vue';
import { host } from '@/config';
import { search } from '@/scripts/search';
import * as os from '@/os';
@ -121,7 +121,7 @@ export default defineComponent({
},
more(ev) {
os.popup(import('@/components/launch-pad.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
src: ev.currentTarget ?? ev.target,
}, {}, 'closed');
},

4
packages/client/src/ui/deck/notifications-column.vue
View File

@ -7,7 +7,7 @@
</template>
<script lang="ts" setup>
import { } from 'vue';
import { defineAsyncComponent } from 'vue';
import XColumn from './column.vue';
import XNotifications from '@/components/notifications.vue';
import * as os from '@/os';
@ -24,7 +24,7 @@ const emit = defineEmits<{
}>();
function func() {
os.popup(import('@/components/notification-setting-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
includingTypes: props.column.includingTypes,
}, {
done: async (res) => {

3
packages/client/src/widgets/notifications.vue
View File

@ -15,6 +15,7 @@ import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExp
import MkContainer from '@/components/ui/container.vue';
import XNotifications from '@/components/notifications.vue';
import * as os from '@/os';
import { defineAsyncComponent } from 'vue';
const name = 'notifications';
@ -49,7 +50,7 @@ const { widgetProps, configure, save } = useWidgetPropsManager(name,
);
const configureNotification = () => {
os.popup(import('@/components/notification-setting-window.vue'), {
os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
includingTypes: widgetProps.includingTypes,
}, {
done: async (res) => {