Fixed navbar menu toggle and product form rendering

shopstr-eng · Sep 12, 2024 · bd54d62 · bd54d62
1 parent ece4dbd
commit bd54d62
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 38 deletions.
diff --git a/components/display-products.tsx b/components/display-products.tsx
@@ -261,7 +261,7 @@ const DisplayProducts = ({
         productEventContext.isLoading ||
         isProductsLoading ||
         isLoadingMore ? (
-          <div className="mt-8 flex items-center justify-center">
+          <div className="mt-6 mb-6 flex items-center justify-center">
             <ShopstrSpinner />
           </div>
         ) : canShowLoadMore && productEvents.length != 0 ? (

diff --git a/components/home/home-feed.tsx b/components/home/home-feed.tsx
@@ -1,12 +1,8 @@
 "use client";
 
-import React, { useEffect, useState } from "react";
+import React from "react";
 
 import MarketplacePage from "./marketplace";
-import ProductForm from "../product-form";
-import { useRouter } from "next/router";
-import { useSearchParams } from "next/navigation";
-import { isUserLoggedIn } from "../utility/nostr-helper-functions";
 
 const HomeFeed = ({
   focusedPubkey,
@@ -15,21 +11,6 @@ const HomeFeed = ({
   focusedPubkey: string;
   setFocusedPubkey: (value: string) => void;
 }) => {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-
-  const [showModal, setShowModal] = useState(false);
-
-  useEffect(() => {
-    if (!searchParams || !isUserLoggedIn()) return;
-    setShowModal(searchParams.has("addNewListing"));
-  }, [searchParams]);
-
-  const handleProductModalToggle = () => {
-    setShowModal(!showModal);
-    router.push("/");
-  };
-
   return (
     <div className="flex flex-1 flex-col">
       <div className="flex h-screen flex-1">
@@ -38,11 +19,6 @@ const HomeFeed = ({
           setFocusedPubkey={setFocusedPubkey}
         />
       </div>
-
-      <ProductForm
-        showModal={showModal}
-        handleModalToggle={handleProductModalToggle}
-      />
     </div>
   );
 };

diff --git a/components/my-listings/my-listings-feed.tsx b/components/my-listings/my-listings-feed.tsx
@@ -20,7 +20,7 @@ const MyListingsFeed = () => {
 
   const handleProductModalToggle = () => {
     setShowModal(!showModal);
-    router.push("/");
+    router.push("");
   };
 
   return (

diff --git a/components/my-listings/my-listings.tsx b/components/my-listings/my-listings.tsx
@@ -17,7 +17,7 @@ export const MyListingsPage = () => {
 
   const handleCreateNewListing = () => {
     if (usersPubkey) {
-      router.push("/?addNewListing");
+      router.push("?addNewListing");
     } else {
       onOpen();
     }
@@ -26,14 +26,6 @@ export const MyListingsPage = () => {
   return (
     <div className="mx-auto h-full w-full">
       <div className="flex max-w-[100%] flex-col bg-light-bg px-3 pb-2 dark:bg-dark-bg">
-        <div>
-          <Button
-            className={`${SHOPSTRBUTTONCLASSNAMES} w-full`}
-            onClick={() => handleCreateNewListing()}
-          >
-            + Add new listing
-          </Button>
-        </div>
         {usersPubkey && (
           <DisplayProducts
             focusedPubkey={usersPubkey}
@@ -44,6 +36,14 @@ export const MyListingsPage = () => {
             isMyListings={true}
           />
         )}
+        <div>
+          <Button
+            className={`${SHOPSTRBUTTONCLASSNAMES} w-full`}
+            onClick={() => handleCreateNewListing()}
+          >
+            + Add new listing
+          </Button>
+        </div>
       </div>
       <SignInModal isOpen={isOpen} onClose={onClose} />
     </div>

diff --git a/components/nav-top.tsx b/components/nav-top.tsx
@@ -80,6 +80,7 @@ const TopNav = ({
   const handleRoute = (path: string) => {
     if (signedIn) {
       router.push(path);
+      setIsMobileMenuOpen(false);
     } else {
       onOpen();
     }
@@ -88,6 +89,7 @@ const TopNav = ({
   const handleHomeClick = () => {
     setFocusedPubkey("");
     router.push("/");
+    setIsMobileMenuOpen(false);
   };
 
   const MobileMenu = () => (

diff --git a/pages/my-listings/index.tsx b/pages/my-listings/index.tsx
@@ -1,10 +1,10 @@
 import React from "react";
-import MyListingsPage from "@/components/my-listings/my-listings";
+import MyListingsFeed from "@/components/my-listings/my-listings-feed";
 
 export default function ShopView() {
   return (
     <div className="flex h-full min-h-screen flex-col bg-light-bg pt-24 dark:bg-dark-bg">
-      <MyListingsPage />
+      <MyListingsFeed />
     </div>
   );
 }