Display waiting dialog if component takes more than a second to load
This commit is contained in:
Freeplay
parent
095ac9d929
commit
8a6112ec24
|
|
@ -232,7 +232,7 @@ export async function popup(
|
|||
|
||||
export function pageWindow(path: string) {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkPageWindow.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkPageWindow.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
initialPath: path,
|
||||
},
|
||||
|
|
@ -243,7 +243,7 @@ export function pageWindow(path: string) {
|
|||
|
||||
export function modalPageWindow(path: string) {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkModalPageWindow.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkModalPageWindow.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
initialPath: path,
|
||||
},
|
||||
|
|
@ -313,7 +313,7 @@ export function yesno(props: {
|
|||
}): Promise<{ canceled: boolean }> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
...props,
|
||||
showCancelButton: true,
|
||||
|
|
@ -344,7 +344,7 @@ export function inputText(props: {
|
|||
> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
title: props.title,
|
||||
text: props.text,
|
||||
|
|
@ -378,7 +378,7 @@ export function inputParagraph(props: {
|
|||
> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
title: props.title,
|
||||
text: props.text,
|
||||
|
|
@ -412,7 +412,7 @@ export function inputNumber(props: {
|
|||
> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
title: props.title,
|
||||
text: props.text,
|
||||
|
|
@ -446,7 +446,7 @@ export function inputDate(props: {
|
|||
> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
title: props.title,
|
||||
text: props.text,
|
||||
|
|
@ -501,7 +501,7 @@ export function select<C = any>(
|
|||
> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
title: props.title,
|
||||
text: props.text,
|
||||
|
|
@ -528,7 +528,7 @@ export function success() {
|
|||
showing.value = false;
|
||||
}, 1000);
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkWaitingDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkWaitingDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
success: true,
|
||||
showing: showing,
|
||||
|
|
@ -545,7 +545,7 @@ export function waiting() {
|
|||
return new Promise((resolve, reject) => {
|
||||
const showing = ref(true);
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkWaitingDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkWaitingDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
success: false,
|
||||
showing: showing,
|
||||
|
|
@ -561,7 +561,7 @@ export function waiting() {
|
|||
export function form(title, form) {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkFormDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkFormDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{ title, form },
|
||||
{
|
||||
done: (result) => {
|
||||
|
|
@ -576,7 +576,7 @@ export function form(title, form) {
|
|||
export async function selectUser() {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkUserSelectDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkUserSelectDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{},
|
||||
{
|
||||
ok: (user) => {
|
||||
|
|
@ -591,9 +591,7 @@ export async function selectUser() {
|
|||
export async function selectInstance(): Promise<Misskey.entities.Instance> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(
|
||||
() => import("@/components/MkInstanceSelectDialog.vue"),
|
||||
),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkInstanceSelectDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{},
|
||||
{
|
||||
ok: (instance) => {
|
||||
|
|
@ -608,9 +606,7 @@ export async function selectInstance(): Promise<Misskey.entities.Instance> {
|
|||
export async function selectDriveFile(multiple: boolean) {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(
|
||||
() => import("@/components/MkDriveSelectDialog.vue"),
|
||||
),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDriveSelectDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
type: "file",
|
||||
multiple,
|
||||
|
|
@ -630,9 +626,7 @@ export async function selectDriveFile(multiple: boolean) {
|
|||
export async function selectDriveFolder(multiple: boolean) {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(
|
||||
() => import("@/components/MkDriveSelectDialog.vue"),
|
||||
),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkDriveSelectDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
type: "folder",
|
||||
multiple,
|
||||
|
|
@ -652,9 +646,7 @@ export async function selectDriveFolder(multiple: boolean) {
|
|||
export async function pickEmoji(src: HTMLElement | null, opts) {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(
|
||||
() => import("@/components/MkEmojiPickerDialog.vue"),
|
||||
),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkEmojiPickerDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
src,
|
||||
...opts,
|
||||
|
|
@ -677,7 +669,7 @@ export async function cropImage(
|
|||
): Promise<Misskey.entities.DriveFile> {
|
||||
return new Promise((resolve, reject) => {
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkCropperDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkCropperDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
file: image,
|
||||
aspectRatio: options.aspectRatio,
|
||||
|
|
@ -741,7 +733,7 @@ export async function openEmojiPicker(
|
|||
});
|
||||
|
||||
openingEmojiPicker = await popup(
|
||||
defineAsyncComponent(() => import("@/components/MkEmojiPickerDialog.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkEmojiPickerDialog.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
src,
|
||||
...opts,
|
||||
|
|
@ -774,7 +766,7 @@ export function popupMenu(
|
|||
return new Promise((resolve, reject) => {
|
||||
let dispose;
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkPopupMenu.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkPopupMenu.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
items,
|
||||
src,
|
||||
|
|
@ -802,7 +794,7 @@ export function contextMenu(
|
|||
return new Promise((resolve, reject) => {
|
||||
let dispose;
|
||||
popup(
|
||||
defineAsyncComponent(() => import("@/components/MkContextMenu.vue")),
|
||||
defineAsyncComponent({ loader: () => import("@/components/MkContextMenu.vue"), loadingComponent: MkWaitingDialog, delay: 1000 }),
|
||||
{
|
||||
items,
|
||||
ev,
|
||||
|
|
|
|||
Loading…
Reference in New Issue