@@ -78,13 +78,13 @@ export default function LibrarySettings() {
{libraries.data
?.sort((a, b) => {
- if (a.uuid === currentLibrary?.uuid) return -1;
- if (b.uuid === currentLibrary?.uuid) return 1;
+ if (a.uuid === library.uuid) return -1;
+ if (b.uuid === library.uuid) return 1;
return 0;
})
.map((library) => (
diff --git a/packages/interface/src/util/index.tsx b/packages/interface/src/util/index.tsx
index 4511a3be0..756037dd1 100644
--- a/packages/interface/src/util/index.tsx
+++ b/packages/interface/src/util/index.tsx
@@ -1,7 +1,12 @@
import { lazy } from '@loadable/component';
import { ReactNode } from 'react';
+import { useParams } from 'react-router';
export function lazyEl(fn: Parameters[0]): ReactNode {
const Element = lazy(fn);
return ;
}
+
+export function useLibraryId() {
+ return useParams<{ libraryId?: string }>().libraryId;
+}
diff --git a/packages/ui/src/Dialog.tsx b/packages/ui/src/Dialog.tsx
index 71b6a18e4..f9be34e94 100644
--- a/packages/ui/src/Dialog.tsx
+++ b/packages/ui/src/Dialog.tsx
@@ -60,8 +60,7 @@ class DialogManager {
if (state.open === false) {
delete this.dialogs[id];
delete this.state[id];
- console.log(`Successfully removed state ${id}`);
- } else console.log(`Tried to remove state ${id} but wasn't pending!`);
+ }
}
}
@@ -82,9 +81,13 @@ function Remover({ id }: { id: number }) {
}
export function useDialog(props: UseDialogProps) {
+ const state = dialogManager.getState(props.id);
+
+ if (!state) throw new Error(`Dialog ${props.id} does not exist!`);
+
return {
...props,
- state: dialogManager.getState(props.id)
+ state
};
}
diff --git a/packages/ui/src/utils.tsx b/packages/ui/src/utils.tsx
index 27ffd0fd4..50a5d09be 100644
--- a/packages/ui/src/utils.tsx
+++ b/packages/ui/src/utils.tsx
@@ -1,11 +1,16 @@
import clsx from 'clsx';
import React from 'react';
-function twFactory(element: any) {
- return ([className, ..._]: TemplateStringsArray) => {
- return restyle(element)(() => className);
- };
-}
+const twFactory =
+ (element: any) =>
+ ([newClassNames, ..._]: TemplateStringsArray) =>
+ React.forwardRef(({ className, ...props }: any, ref) =>
+ React.createElement(element, {
+ ...props,
+ className: clsx(newClassNames, className),
+ ref
+ })
+ );
type ClassnameFactory = (s: TemplateStringsArray) => T;
@@ -22,21 +27,3 @@ export const tw = new Proxy((() => {}) as unknown as TailwindFactory, {
get: (_, property: string) => twFactory(property),
apply: (_, __, [el]: [React.ReactElement]) => twFactory(el)
});
-
-export const restyle = <
- T extends
- | string
- | React.FunctionComponent<{ className: string }>
- | React.ComponentClass<{ className: string }>
->(
- element: T
-) => {
- return (cls: () => string) =>
- React.forwardRef(({ className, ...props }: any, ref) =>
- React.createElement(element, {
- ...props,
- className: clsx(cls(), className),
- ref
- })
- );
-};