summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/hook
diff options
context:
space:
mode:
authorHazelnoot <acomputerdog@gmail.com>2025-02-03 14:31:26 -0500
committerHazelnoot <acomputerdog@gmail.com>2025-02-03 14:36:09 -0500
commita4e86758c1c53f4e623b6e8f613d4a6e34e96156 (patch)
treed09bf325b7f52512a1fe2a9d35f1953d2b310309 /packages/frontend/src/components/hook
parentmerge: Use package manager version from package.json (!883) (diff)
parentfix(build): corepackのバグの回避 (#15387) (diff)
downloadsharkey-a4e86758c1c53f4e623b6e8f613d4a6e34e96156.tar.gz
sharkey-a4e86758c1c53f4e623b6e8f613d4a6e34e96156.tar.bz2
sharkey-a4e86758c1c53f4e623b6e8f613d4a6e34e96156.zip
merge upstream 2025-02-03
Diffstat (limited to 'packages/frontend/src/components/hook')
-rw-r--r--packages/frontend/src/components/hook/useLoading.ts52
1 files changed, 52 insertions, 0 deletions
diff --git a/packages/frontend/src/components/hook/useLoading.ts b/packages/frontend/src/components/hook/useLoading.ts
new file mode 100644
index 0000000000..6c6ff6ae0d
--- /dev/null
+++ b/packages/frontend/src/components/hook/useLoading.ts
@@ -0,0 +1,52 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { computed, h, ref } from 'vue';
+import MkLoading from '@/components/global/MkLoading.vue';
+
+export const useLoading = (props?: {
+ static?: boolean;
+ inline?: boolean;
+ colored?: boolean;
+ mini?: boolean;
+ em?: boolean;
+}) => {
+ const showingCnt = ref(0);
+
+ const show = () => {
+ showingCnt.value++;
+ };
+
+ const close = (force?: boolean) => {
+ if (force) {
+ showingCnt.value = 0;
+ } else {
+ showingCnt.value = Math.max(0, showingCnt.value - 1);
+ }
+ };
+
+ const scope = <T>(fn: () => T) => {
+ show();
+
+ const result = fn();
+ if (result instanceof Promise) {
+ return result.finally(() => close());
+ } else {
+ close();
+ return result;
+ }
+ };
+
+ const showing = computed(() => showingCnt.value > 0);
+ const component = computed(() => showing.value ? h(MkLoading, props) : null);
+
+ return {
+ show,
+ close,
+ scope,
+ component,
+ showing,
+ };
+};