From 73b4ae7bdea1c963b554f7e886b6911337f7317d Mon Sep 17 00:00:00 2001
From: Andy Espagnolo <andyespagnolo@gmail.com>
Date: Wed, 25 Oct 2023 12:38:30 -0300
Subject: [PATCH 1/3] fix: proposal render issue

---
 src/components/Common/MediaQuery/Mobile.css    | 5 +++++
 src/components/Common/MediaQuery/Mobile.tsx    | 5 +++++
 src/components/Common/MediaQuery/NotMobile.css | 9 +++++++++
 src/components/Common/MediaQuery/NotMobile.tsx | 5 +++++
 src/helpers/index.ts                           | 4 ++++
 src/pages/proposal.tsx                         | 1 -
 src/pages/proposals.tsx                        | 4 +++-
 7 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 src/components/Common/MediaQuery/Mobile.css
 create mode 100644 src/components/Common/MediaQuery/Mobile.tsx
 create mode 100644 src/components/Common/MediaQuery/NotMobile.css
 create mode 100644 src/components/Common/MediaQuery/NotMobile.tsx

diff --git a/src/components/Common/MediaQuery/Mobile.css b/src/components/Common/MediaQuery/Mobile.css
new file mode 100644
index 000000000..1e306ebd2
--- /dev/null
+++ b/src/components/Common/MediaQuery/Mobile.css
@@ -0,0 +1,5 @@
+@media (min-width: 768px) {
+  .MediaQuery__Mobile {
+    display: none;
+  }
+}
diff --git a/src/components/Common/MediaQuery/Mobile.tsx b/src/components/Common/MediaQuery/Mobile.tsx
new file mode 100644
index 000000000..0e2884db9
--- /dev/null
+++ b/src/components/Common/MediaQuery/Mobile.tsx
@@ -0,0 +1,5 @@
+import './Mobile.css'
+
+export default function Mobile({ children }: { children: React.ReactNode }) {
+  return <div className="MediaQuery__Mobile">{children}</div>
+}
diff --git a/src/components/Common/MediaQuery/NotMobile.css b/src/components/Common/MediaQuery/NotMobile.css
new file mode 100644
index 000000000..e1d49c196
--- /dev/null
+++ b/src/components/Common/MediaQuery/NotMobile.css
@@ -0,0 +1,9 @@
+.MediaQuery__NotMobile {
+  display: none;
+}
+
+@media (min-width: 768px) {
+  .MediaQuery__NotMobile {
+    display: block;
+  }
+}
diff --git a/src/components/Common/MediaQuery/NotMobile.tsx b/src/components/Common/MediaQuery/NotMobile.tsx
new file mode 100644
index 000000000..541cf8e92
--- /dev/null
+++ b/src/components/Common/MediaQuery/NotMobile.tsx
@@ -0,0 +1,5 @@
+import './NotMobile.css'
+
+export default function NotMobile({ children }: { children: React.ReactNode }) {
+  return <div className="MediaQuery__NotMobile">{children}</div>
+}
diff --git a/src/helpers/index.ts b/src/helpers/index.ts
index d968e0b5b..c3af3de21 100644
--- a/src/helpers/index.ts
+++ b/src/helpers/index.ts
@@ -42,6 +42,10 @@ export function getUncappedRoundedPercentage(value: number, total: number): numb
 }
 
 export function getUrlFilters<T>(filterKey: string, params: URLSearchParams, value?: T) {
+  if (typeof window === 'undefined') {
+    return ''
+  }
+
   const newParams = new URLSearchParams(params)
   value ? newParams.set(filterKey, String(value)) : newParams.delete(filterKey)
   newParams.delete('page')
diff --git a/src/pages/proposal.tsx b/src/pages/proposal.tsx
index 49cf35df9..03307d4b5 100644
--- a/src/pages/proposal.tsx
+++ b/src/pages/proposal.tsx
@@ -7,7 +7,6 @@ import Head from 'decentraland-gatsby/dist/components/Head/Head'
 import NotFound from 'decentraland-gatsby/dist/components/Layout/NotFound'
 import useAuthContext from 'decentraland-gatsby/dist/context/Auth/useAuthContext'
 import usePatchState from 'decentraland-gatsby/dist/hooks/usePatchState'
-import { Loader } from 'decentraland-ui/dist/components/Loader/Loader'
 import { NotMobile, useMobileMediaQuery } from 'decentraland-ui/dist/components/Media/Media'
 
 import { ErrorClient } from '../clients/ErrorClient'
diff --git a/src/pages/proposals.tsx b/src/pages/proposals.tsx
index 5cdc03581..639f0b8b6 100644
--- a/src/pages/proposals.tsx
+++ b/src/pages/proposals.tsx
@@ -5,12 +5,14 @@ import Head from 'decentraland-gatsby/dist/components/Head/Head'
 import useAuthContext from 'decentraland-gatsby/dist/context/Auth/useAuthContext'
 import { Button } from 'decentraland-ui/dist/components/Button/Button'
 import { Loader } from 'decentraland-ui/dist/components/Loader/Loader'
-import { Mobile, NotMobile, useTabletAndBelowMediaQuery } from 'decentraland-ui/dist/components/Media/Media'
+import { useTabletAndBelowMediaQuery } from 'decentraland-ui/dist/components/Media/Media'
 import { Pagination } from 'decentraland-ui/dist/components/Pagination/Pagination'
 
 import RandomBanner from '../components/Banner/RandomBanner'
 import CategoryBanner from '../components/Category/CategoryBanner'
 import Empty from '../components/Common/Empty'
+import Mobile from '../components/Common/MediaQuery/Mobile'
+import NotMobile from '../components/Common/MediaQuery/NotMobile'
 import ProposalPreviewCard from '../components/Common/ProposalPreviewCard/ProposalPreviewCard'
 import Link from '../components/Common/Typography/Link'
 import Text from '../components/Common/Typography/Text'

From a8d57053ef7d54d88009a0c6735fb6e847b3e9e0 Mon Sep 17 00:00:00 2001
From: Andy Espagnolo <andyespagnolo@gmail.com>
Date: Wed, 25 Oct 2023 14:02:22 -0300
Subject: [PATCH 2/3] fix: add proposals check in loading

---
 src/components/Proposal/View/ProposalCard.tsx | 2 +-
 src/pages/proposals.tsx                       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Proposal/View/ProposalCard.tsx b/src/components/Proposal/View/ProposalCard.tsx
index b3ea93297..738b04080 100644
--- a/src/components/Proposal/View/ProposalCard.tsx
+++ b/src/components/Proposal/View/ProposalCard.tsx
@@ -75,7 +75,7 @@ export default function ProposalCard({
                 <span>{' · '}</span>
               </>
             )}
-            <span className="ProposalCard__DetailsItem ProposalCard__DetailsOnlyDesktop">
+            <span className="ProposalCard__DetailsItem">
               {showLeadingVP
                 ? t('page.home.open_proposals.leading_vp', {
                     total: formatNumber(winningChoice.power),
diff --git a/src/pages/proposals.tsx b/src/pages/proposals.tsx
index 639f0b8b6..2a01210c0 100644
--- a/src/pages/proposals.tsx
+++ b/src/pages/proposals.tsx
@@ -100,7 +100,7 @@ export default function ProposalsPage() {
     return <MaintenanceLayout title={title} description={description} activeTab={NavigationTab.Proposals} />
   }
 
-  const isLoading = isLoadingProposals || isLoadingVotes
+  const isLoading = !proposals || isLoadingProposals || isLoadingVotes
 
   return (
     <>

From 56143e8a799a81fab967d9e1bac081a5ab0fbc49 Mon Sep 17 00:00:00 2001
From: Andy Espagnolo <andyespagnolo@gmail.com>
Date: Wed, 25 Oct 2023 14:22:59 -0300
Subject: [PATCH 3/3] fix: proposals check rendering

---
 src/pages/proposals.tsx | 36 +++++++++++++++---------------------
 1 file changed, 15 insertions(+), 21 deletions(-)

diff --git a/src/pages/proposals.tsx b/src/pages/proposals.tsx
index 2a01210c0..92cd6313a 100644
--- a/src/pages/proposals.tsx
+++ b/src/pages/proposals.tsx
@@ -113,7 +113,7 @@ export default function ProposalsPage() {
         <div className="OnlyDesktop">
           <RandomBanner isVisible={!searching} />
         </div>
-        {search && proposals && (
+        {search && (
           <NotMobile>
             <SearchTitle />
           </NotMobile>
@@ -129,33 +129,27 @@ export default function ProposalsPage() {
             </NotMobile>
           </div>
           <div className="ProposalsPage__Content">
-            {proposals && (
+            {search && (
               <Mobile>
                 <SearchTitle />
               </Mobile>
             )}
             <ActionableLayout
               leftAction={
-                proposals && (
-                  <Text color="secondary" weight="semi-bold" className="ProposalsPage__ProposalCount">
-                    {t('general.count_proposals', { count: proposals.total || 0 })}
-                  </Text>
-                )
+                <Text color="secondary" weight="semi-bold" className="ProposalsPage__ProposalCount">
+                  {t('general.count_proposals', { count: proposals?.total || 0 })}
+                </Text>
               }
               rightAction={
                 <>
-                  {proposals && (
-                    <>
-                      <SortingMenu />
-                      <Mobile>
-                        <FilterMenu>
-                          <CategoryFilter filterType={ProposalType} />
-                          <StatusFilter statusType={ProposalStatus} />
-                          <TimeFrameFilter />
-                        </FilterMenu>
-                      </Mobile>
-                    </>
-                  )}
+                  <SortingMenu />
+                  <Mobile>
+                    <FilterMenu>
+                      <CategoryFilter filterType={ProposalType} />
+                      <StatusFilter statusType={ProposalStatus} />
+                      <TimeFrameFilter />
+                    </FilterMenu>
+                  </Mobile>
                   <Button
                     primary
                     size="small"
@@ -168,14 +162,14 @@ export default function ProposalsPage() {
                 </>
               }
             >
-              {type && !searching && <CategoryBanner type={type} />}
               {isLoading && (
                 <div className="ProposalsPage__LoaderContainer">
-                  <Loader size="medium" active={!proposals || isLoading} />
+                  <Loader size="medium" active={isLoading} />
                 </div>
               )}
               {!isLoading && (
                 <>
+                  {type && !searching && <CategoryBanner type={type} />}
                   {proposals && proposals.data.length === 0 && (
                     <Empty
                       className="ProposalsPage__Empty"