refactor: move authentication overlay to the nomination modal (#603)

ArdentHQ · Jan 18, 2024 · 321f98c · 321f98c
1 parent e439a1a
commit 321f98c
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 18 deletions.
diff --git a/resources/js/Components/Layout/Overlay/Overlay.tsx b/resources/js/Components/Layout/Overlay/Overlay.tsx
@@ -17,7 +17,7 @@ export const Overlay = ({
     >
         <div
             className={cn(
-                "fixed inset-0 z-50 bg-white backdrop-blur dark:bg-theme-dark-900/90",
+                "fixed inset-0 z-[51] bg-white backdrop-blur dark:bg-theme-dark-900/90",
                 className,
                 showCloseButton ? "bg-opacity-90" : "bg-opacity-60",
             )}

diff --git a/resources/js/Pages/Collections/Components/CollectionVoting/NominationDialog.tsx b/resources/js/Pages/Collections/Components/CollectionVoting/NominationDialog.tsx
@@ -9,6 +9,7 @@ import { EmptyBlock } from "@/Components/EmptyBlock/EmptyBlock";
 import { SearchInput } from "@/Components/Form/SearchInput";
 import { LoadingBlock } from "@/Components/LoadingBlock/LoadingBlock";
 import { Tooltip } from "@/Components/Tooltip";
+import { useAuthorizedAction } from "@/Hooks/useAuthorizedAction";
 import { useDebounce } from "@/Hooks/useDebounce";
 import { CollectionsVoteReceivedModal } from "@/Pages/Collections/Components/CollectionsVoteReceivedModal";
 
@@ -87,6 +88,8 @@ export const NominationDialog = ({
     const [selectedCollection, setSelectedCollection] = useState(0);
     const [collections, setCollections] = useState(initialCollections);
 
+    const { signedAction } = useAuthorizedAction();
+
     const [debouncedQuery] = useDebounce(query, 500);
 
     const searchCollections = async (): Promise<void> => {
@@ -130,22 +133,24 @@ export const NominationDialog = ({
     );
 
     const vote = (): void => {
-        setLoading(true);
-
-        router.post(
-            route("collection-votes.create", collection),
-            {},
-            {
-                preserveState: true,
-                preserveScroll: true,
-                onFinish: () => {
-                    setLoading(false);
-                    setIsOpen(false);
+        void signedAction((): void => {
+            setLoading(true);
+
+            router.post(
+                route("collection-votes.create", collection),
+                {},
+                {
+                    preserveState: true,
+                    preserveScroll: true,
+                    onFinish: () => {
+                        setLoading(false);
+                        setIsOpen(false);
 
-                    setShowConfirmationDialog(true);
+                        setShowConfirmationDialog(true);
+                    },
                 },
-            },
-        );
+            );
+        });
     };
 
     return (

diff --git a/resources/js/Pages/Collections/Components/CollectionVoting/VoteCollections.tsx b/resources/js/Pages/Collections/Components/CollectionVoting/VoteCollections.tsx
@@ -149,9 +149,7 @@ export const VoteCollections = ({
                     {votedCollection === null && (
                         <LinkButton
                             onClick={(): void => {
-                                void signedAction(() => {
-                                    setIsDialogOpen(true);
-                                });
+                                setIsDialogOpen(true);
                             }}
                             variant="link"
                             className="font-medium leading-6 dark:hover:decoration-theme-primary-400"