feat(plugin): ShikiCodeblocks (#267)

Co-authored-by: ArjixWasTaken <53124886+ArjixWasTaken@users.noreply.github.com>
Co-authored-by: Ven <vendicated@riseup.net>

1 files changed, 40 insertions, 9 deletions

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);
+};