fix: No more 404 errors in the browser console (#1983)

open-sauced · Oct 23, 2023 · c6c73f7 · c6c73f7
1 parent 973be2f
commit c6c73f7
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 7 deletions.
diff --git a/components/molecules/ContributorHighlight/contributor-highlight-card.tsx b/components/molecules/ContributorHighlight/contributor-highlight-card.tsx
@@ -120,8 +120,9 @@ const ContributorHighlightCard = ({
   const [tagRepoSearchLoading, setTagRepoSearchLoading] = useState<boolean>(false);
   const [addTaggedRepoFormOpen, setAddTaggedRepoFormOpen] = useState(false);
   const [host, setHost] = useState("");
+  const [dropdownOpen, setDropdownOpen] = useState(false);
   const { follow, unFollow, isError } = useFollowUser(
-    loggedInUser && loggedInUser?.user_metadata.username !== user ? user : ""
+    dropdownOpen && loggedInUser && loggedInUser?.user_metadata.user_name !== user ? user : ""
   );
 
   const [date, setDate] = useState<Date | undefined>(shipped_date ? new Date(shipped_date) : undefined);
@@ -441,7 +442,13 @@ const ContributorHighlightCard = ({
           {icon}
           <span className="text-sm text-light-slate-11">{getHighlightTypePreset(type).text}</span>
           <div className="flex items-center gap-3 ml-auto lg:gap-3">
-            <DropdownMenu modal={false}>
+            <DropdownMenu
+              open={dropdownOpen}
+              onOpenChange={(value) => {
+                setDropdownOpen(value);
+              }}
+              modal={false}
+            >
               <div className="flex items-center gap-3 w-max">
                 <Tooltip direction="top" content="share on twitter">
                   <a

diff --git a/pages/feed/index.tsx b/pages/feed/index.tsx
@@ -35,6 +35,7 @@ import NewsletterForm from "components/molecules/NewsletterForm/newsletter-form"
 import UserCard, { MetaObj } from "components/atoms/UserCard/user-card";
 import FeaturedHighlightsPanel from "components/molecules/FeaturedHighlightsPanel/featured-highlights-panel";
 import AnnouncementCard from "components/molecules/AnnouncementCard/announcement-card";
+import { useMediaQuery } from "lib/hooks/useMediaQuery";
 
 type activeTabType = "home" | "following";
 type highlightReposType = { repoName: string; repoIcon: string; full_name: string };
@@ -78,6 +79,8 @@ const Feeds: WithPageLayout<HighlightSSRProps> = (props: HighlightSSRProps) => {
 
   const { data: followersRepo } = useFetchFollowersHighlightRepos();
 
+  const isDesktop = useMediaQuery("(min-width: 1280px)");
+
   const { data, mutate, setPage, isLoading, meta } = useFetchAllHighlights(selectedRepo);
   const { data: emojis } = useFetchAllEmojis();
 
@@ -212,11 +215,13 @@ const Feeds: WithPageLayout<HighlightSSRProps> = (props: HighlightSSRProps) => {
                 />
               </div>
             )}
-            <TopContributorsPanel
-              loggedInUserLogin={loggedInUser?.login ?? ""}
-              loggedInUserId={loggedInUser?.id ?? undefined}
-              refreshLoggedInUser={refreshLoggedInUser}
-            />
+            {isDesktop && (
+              <TopContributorsPanel
+                loggedInUserLogin={loggedInUser?.login ?? ""}
+                loggedInUserId={loggedInUser?.id ?? undefined}
+                refreshLoggedInUser={refreshLoggedInUser}
+              />
+            )}
             <AnnouncementCard
               title="#100DaysOfOSS 🚀 "
               description={