aboutsummaryrefslogtreecommitdiff
path: root/src/utils
diff options
context:
space:
mode:
Diffstat (limited to 'src/utils')
-rw-r--r--src/utils/constants.ts6
-rw-r--r--src/utils/dependencies.ts4
-rw-r--r--src/utils/misc.tsx49
-rw-r--r--src/utils/react.ts62
-rw-r--r--src/utils/text.ts36
5 files changed, 147 insertions, 10 deletions
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index eead2a3..f45e8b0 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -157,8 +157,12 @@ export const Devs = Object.freeze({
name: "Luny",
id: 821472922140803112n
},
+ Vap: {
+ name: "Vap0r1ze",
+ id: 454072114492866560n
+ },
KingFish: {
name: "King Fish",
id: 499400512559382538n
- }
+ },
});
diff --git a/src/utils/dependencies.ts b/src/utils/dependencies.ts
index a7766de..ed26644 100644
--- a/src/utils/dependencies.ts
+++ b/src/utils/dependencies.ts
@@ -74,3 +74,7 @@ export interface ApngFrameData {
frames: ApngFrame[];
playTime: number;
}
+
+const shikiWorkerDist = "https://unpkg.com/@vap/shiki-worker@0.0.8/dist";
+export const shikiWorkerSrc = `${shikiWorkerDist}/${IS_DEV ? "index.js" : "index.min.js"}`;
+export const shikiOnigasmSrc = "https://unpkg.com/@vap/shiki@0.10.3/dist/onig.wasm";
diff --git a/src/utils/misc.tsx b/src/utils/misc.tsx
index d9164a0..8b7cea2 100644
--- a/src/utils/misc.tsx
+++ b/src/utils/misc.tsx
@@ -28,7 +28,12 @@ export function makeLazy<T>(factory: () => T): () => T {
return () => cache ?? (cache = factory());
}
-type AwaiterRes<T> = [T, any, boolean, () => void];
+type AwaiterRes<T> = [T, any, boolean];
+interface AwaiterOpts<T> {
+ fallbackValue: T,
+ deps?: unknown[],
+ onError?(e: any): void,
+}
/**
* Await a promise
* @param factory Factory
@@ -36,26 +41,31 @@ type AwaiterRes<T> = [T, any, boolean, () => void];
* @returns [value, error, isPending]
*/
export function useAwaiter<T>(factory: () => Promise<T>): AwaiterRes<T | null>;
-export function useAwaiter<T>(factory: () => Promise<T>, fallbackValue: T): AwaiterRes<T>;
-export function useAwaiter<T>(factory: () => Promise<T>, fallbackValue: null, onError: (e: unknown) => unknown): AwaiterRes<T>;
-export function useAwaiter<T>(factory: () => Promise<T>, fallbackValue: T | null = null, onError?: (e: unknown) => unknown): AwaiterRes<T | null> {
+export function useAwaiter<T>(factory: () => Promise<T>, providedOpts: AwaiterOpts<T>): AwaiterRes<T>;
+export function useAwaiter<T>(factory: () => Promise<T>, providedOpts?: AwaiterOpts<T | null>): AwaiterRes<T | null> {
+ const opts: Required<AwaiterOpts<T | null>> = Object.assign({
+ fallbackValue: null,
+ deps: [],
+ onError: null,
+ }, providedOpts);
const [state, setState] = React.useState({
- value: fallbackValue,
+ value: opts.fallbackValue,
error: null,
pending: true
});
- const [signal, setSignal] = React.useState(0);
React.useEffect(() => {
let isAlive = true;
+ if (!state.pending) setState({ ...state, pending: true });
+
factory()
.then(value => isAlive && setState({ value, error: null, pending: false }))
- .catch(error => isAlive && (setState({ value: null, error, pending: false }), onError?.(error)));
+ .catch(error => isAlive && (setState({ value: null, error, pending: false }), opts.onError?.(error)));
return () => void (isAlive = false);
- }, [signal]);
+ }, opts.deps);
- return [state.value, state.error, state.pending, () => setSignal(signal + 1)];
+ return [state.value, state.error, state.pending];
}
/**
@@ -197,3 +207,24 @@ export function copyWithToast(text: string, toastMessage = "Copied to clipboard!
export function isObject(obj: unknown): obj is object {
return typeof obj === "object" && obj !== null && !Array.isArray(obj);
}
+
+/**
+ * Returns null if value is not a URL, otherwise return URL object.
+ * Avoids having to wrap url checks in a try/catch
+ */
+export function parseUrl(urlString: string): URL | null {
+ try {
+ return new URL(urlString);
+ } catch {
+ return null;
+ }
+}
+
+/**
+ * Checks whether an element is on screen
+ */
+export const checkIntersecting = (el: Element) => {
+ const elementBox = el.getBoundingClientRect();
+ const documentHeight = Math.max(document.documentElement.clientHeight, window.innerHeight);
+ return !(elementBox.bottom < 0 || elementBox.top - documentHeight >= 0);
+};
diff --git a/src/utils/react.ts b/src/utils/react.ts
new file mode 100644
index 0000000..8585846
--- /dev/null
+++ b/src/utils/react.ts
@@ -0,0 +1,62 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { React } from "@webpack/common";
+
+import { checkIntersecting } from "./misc";
+
+/**
+ * Check if an element is on screen
+ * @param intersectOnly If `true`, will only update the state when the element comes into view
+ * @returns [refCallback, isIntersecting]
+ */
+export const useIntersection = (intersectOnly = false): [
+ refCallback: React.RefCallback<Element>,
+ isIntersecting: boolean,
+] => {
+ const observerRef = React.useRef<IntersectionObserver | null>(null);
+ const [isIntersecting, setIntersecting] = React.useState(false);
+
+ const refCallback = (element: Element | null) => {
+ observerRef.current?.disconnect();
+ observerRef.current = null;
+
+ if (!element) return;
+
+ if (checkIntersecting(element)) {
+ setIntersecting(true);
+ if (intersectOnly) return;
+ }
+
+ observerRef.current = new IntersectionObserver(entries => {
+ for (const entry of entries) {
+ if (entry.target !== element) continue;
+ if (entry.isIntersecting && intersectOnly) {
+ setIntersecting(true);
+ observerRef.current?.disconnect();
+ observerRef.current = null;
+ } else {
+ setIntersecting(entry.isIntersecting);
+ }
+ }
+ });
+ observerRef.current.observe(element);
+ };
+
+ return [refCallback, isIntersecting];
+};
diff --git a/src/utils/text.ts b/src/utils/text.ts
new file mode 100644
index 0000000..17826e8
--- /dev/null
+++ b/src/utils/text.ts
@@ -0,0 +1,36 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+*/
+
+// Utils for readable text transformations eg: `toTitle(fromKebab())`
+
+// Case style to words
+export const wordsFromCamel = (text: string) => text.split(/(?=[A-Z])/).map(w => w.toLowerCase());
+export const wordsFromSnake = (text: string) => text.toLowerCase().split("_");
+export const wordsFromKebab = (text: string) => text.toLowerCase().split("-");
+export const wordsFromPascal = (text: string) => text.split(/(?=[A-Z])/).map(w => w.toLowerCase());
+export const wordsFromTitle = (text: string) => text.toLowerCase().split(" ");
+
+// Words to case style
+export const wordsToCamel = (words: string[]) =>
+ words.map((w, i) => (i ? w[0].toUpperCase() + w.slice(1) : w)).join("");
+export const wordsToSnake = (words: string[]) => words.join("_").toUpperCase();
+export const wordsToKebab = (words: string[]) => words.join("-").toLowerCase();
+export const wordsToPascal = (words: string[]) =>
+ words.map(w => w[0].toUpperCase() + w.slice(1)).join("");
+export const wordsToTitle = (words: string[]) =>
+ words.map(w => w[0].toUpperCase() + w.slice(1)).join(" ");