From 9ed1dd714b2145627229c1097a2b5911fa813b5c Mon Sep 17 00:00:00 2001
From: Geometrically <18202329+Geometrically@users.noreply.github.com>
Date: Wed, 21 Aug 2024 00:30:23 -0700
Subject: [PATCH] Fix ads showing with Modrinth PLus (#2187)

---
 apps/frontend/src/components/ui/AdPlaceholder.vue      |  7 +------
 apps/frontend/src/layouts/default.vue                  |  2 +-
 apps/frontend/src/pages/[type]/[id]/changelog.vue      | 10 +++++++++-
 apps/frontend/src/pages/[type]/[id]/index.vue          |  8 +++++++-
 .../src/pages/[type]/[id]/version/[version].vue        |  7 ++++++-
 apps/frontend/src/pages/[type]/[id]/versions.vue       |  8 +++++++-
 apps/frontend/src/pages/collection/[id].vue            |  2 +-
 apps/frontend/src/pages/organization/[id].vue          |  2 +-
 apps/frontend/src/pages/search/[searchProjectType].vue |  3 ++-
 apps/frontend/src/pages/user/[id].vue                  |  2 +-
 10 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/apps/frontend/src/components/ui/AdPlaceholder.vue b/apps/frontend/src/components/ui/AdPlaceholder.vue
index 0629c9e00..948ac2731 100644
--- a/apps/frontend/src/components/ui/AdPlaceholder.vue
+++ b/apps/frontend/src/components/ui/AdPlaceholder.vue
@@ -1,8 +1,5 @@
 <template>
-  <div
-    v-if="!auth.user || isPermission(auth.user.badges, 1 << 0)"
-    class="ad-parent relative mb-3 flex w-full justify-center rounded-2xl bg-bg-raised"
-  >
+  <div class="ad-parent relative mb-3 flex w-full justify-center rounded-2xl bg-bg-raised">
     <div class="flex max-h-[250px] min-h-[250px] min-w-[300px] max-w-[300px] flex-col gap-4 p-6">
       <p class="m-0 text-2xl font-bold text-contrast">90% of ad revenue goes to creators</p>
       <nuxt-link to="/plus" class="mt-auto items-center gap-1 text-purple hover:underline">
@@ -43,8 +40,6 @@ useHead({
   ],
 });
 
-const auth = await useAuth();
-
 onMounted(() => {
   window.tude = window.tude || { cmd: [] };
   tude.cmd.push(function () {
diff --git a/apps/frontend/src/layouts/default.vue b/apps/frontend/src/layouts/default.vue
index 0bdc4b03f..7857e8fda 100644
--- a/apps/frontend/src/layouts/default.vue
+++ b/apps/frontend/src/layouts/default.vue
@@ -148,7 +148,7 @@
             <NuxtLink to="/app"> <DownloadIcon aria-hidden="true" /> Get Modrinth App </NuxtLink>
           </ButtonStyled>
           <ButtonStyled
-            v-if="!auth.user || isPermission(auth.badges, 1 << 0)"
+            v-if="!auth.user || !isPermission(auth.user.badges, 1 << 0)"
             type="transparent"
             color="purple"
           >
diff --git a/apps/frontend/src/pages/[type]/[id]/changelog.vue b/apps/frontend/src/pages/[type]/[id]/changelog.vue
index 8f0bd053b..5e3e7f3a9 100644
--- a/apps/frontend/src/pages/[type]/[id]/changelog.vue
+++ b/apps/frontend/src/pages/[type]/[id]/changelog.vue
@@ -58,7 +58,12 @@
     />
   </div>
   <div class="normal-page__sidebar">
-    <AdPlaceholder />
+    <AdPlaceholder
+      v-if="
+        (!auth.user || !isPermission(auth.user.badges, 1 << 0)) &&
+        tags.approvedStatuses.includes(props.project.status)
+      "
+    />
     <VersionFilterControl :versions="props.versions" @switch-page="switchPage" />
   </div>
 </template>
@@ -91,6 +96,9 @@ const props = defineProps({
   },
 });
 
+const auth = await useAuth();
+const tags = useTags();
+
 const title = `${props.project.title} - Changelog`;
 const description = `View the changelog of ${props.project.title}'s ${props.versions.length} versions.`;
 
diff --git a/apps/frontend/src/pages/[type]/[id]/index.vue b/apps/frontend/src/pages/[type]/[id]/index.vue
index aa5007ac1..ca27ab009 100644
--- a/apps/frontend/src/pages/[type]/[id]/index.vue
+++ b/apps/frontend/src/pages/[type]/[id]/index.vue
@@ -21,7 +21,12 @@
     />
   </section>
   <div class="normal-page__sidebar">
-    <AdPlaceholder />
+    <AdPlaceholder
+      v-if="
+        (!auth.user || !isPermission(auth.user.badges, 1 << 0)) &&
+        tags.approvedStatuses.includes(props.project.status)
+      "
+    />
     <div v-if="versions.length > 0" class="card flex-card experimental-styles-within">
       <h2>{{ formatMessage(compatibilityMessages.title) }}</h2>
       <section>
@@ -361,6 +366,7 @@ const props = defineProps({
   },
 });
 
+const auth = await useAuth();
 const tags = useTags();
 const { formatMessage } = useVIntl();
 const formatRelativeTime = useRelativeTime();
diff --git a/apps/frontend/src/pages/[type]/[id]/version/[version].vue b/apps/frontend/src/pages/[type]/[id]/version/[version].vue
index 8abc8a0a8..494edd23a 100644
--- a/apps/frontend/src/pages/[type]/[id]/version/[version].vue
+++ b/apps/frontend/src/pages/[type]/[id]/version/[version].vue
@@ -469,7 +469,12 @@
     </div>
   </div>
   <div class="normal-page__sidebar version-page__metadata">
-    <AdPlaceholder />
+    <AdPlaceholder
+      v-if="
+        (!auth.user || !isPermission(auth.user.badges, 1 << 0)) &&
+        tags.approvedStatuses.includes(props.project.status)
+      "
+    />
     <div class="universal-card full-width-inputs">
       <h3>Metadata</h3>
       <div>
diff --git a/apps/frontend/src/pages/[type]/[id]/versions.vue b/apps/frontend/src/pages/[type]/[id]/versions.vue
index 1d78830c6..b9d4e19be 100644
--- a/apps/frontend/src/pages/[type]/[id]/versions.vue
+++ b/apps/frontend/src/pages/[type]/[id]/versions.vue
@@ -255,7 +255,12 @@
     </div>
   </section>
   <div class="normal-page__sidebar">
-    <AdPlaceholder />
+    <AdPlaceholder
+      v-if="
+        (!auth.user || !isPermission(auth.user.badges, 1 << 0)) &&
+        tags.approvedStatuses.includes(props.project.status)
+      "
+    />
     <VersionFilterControl
       ref="versionFilters"
       :versions="props.versions"
@@ -316,6 +321,7 @@ const props = defineProps({
   },
 });
 
+const auth = await useAuth();
 const tags = useTags();
 const formatRelativeTime = useRelativeTime();
 
diff --git a/apps/frontend/src/pages/collection/[id].vue b/apps/frontend/src/pages/collection/[id].vue
index 4aea22017..5b68ac968 100644
--- a/apps/frontend/src/pages/collection/[id].vue
+++ b/apps/frontend/src/pages/collection/[id].vue
@@ -248,7 +248,7 @@
             </div>
           </template>
         </div>
-        <AdPlaceholder />
+        <AdPlaceholder v-if="!auth.user || !isPermission(auth.user.badges, 1 << 0)" />
       </div>
       <div class="normal-page__content">
         <nav class="navigation-card">
diff --git a/apps/frontend/src/pages/organization/[id].vue b/apps/frontend/src/pages/organization/[id].vue
index f483247ca..c3d811a52 100644
--- a/apps/frontend/src/pages/organization/[id].vue
+++ b/apps/frontend/src/pages/organization/[id].vue
@@ -109,7 +109,7 @@
           </div>
         </div>
 
-        <AdPlaceholder />
+        <AdPlaceholder v-if="!auth.user || !isPermission(auth.user.badges, 1 << 0)" />
 
         <div class="creator-list universal-card">
           <div class="title-and-link">
diff --git a/apps/frontend/src/pages/search/[searchProjectType].vue b/apps/frontend/src/pages/search/[searchProjectType].vue
index 4c5f1b6e1..8b22844f6 100644
--- a/apps/frontend/src/pages/search/[searchProjectType].vue
+++ b/apps/frontend/src/pages/search/[searchProjectType].vue
@@ -12,7 +12,7 @@
       }"
       aria-label="Filters"
     >
-      <AdPlaceholder />
+      <AdPlaceholder v-if="!auth.user || !isPermission(auth.user.badges, 1 << 0)" />
       <section class="card gap-1" :class="{ 'max-lg:!hidden': !sidebarMenuOpen }">
         <div class="flex items-center gap-2">
           <div class="iconified-input w-full">
@@ -282,6 +282,7 @@ const route = useNativeRoute();
 
 const cosmetics = useCosmetics();
 const tags = useTags();
+const auth = await useAuth();
 
 const query = ref("");
 const facets = ref([]);
diff --git a/apps/frontend/src/pages/user/[id].vue b/apps/frontend/src/pages/user/[id].vue
index c38636157..0ef028d51 100644
--- a/apps/frontend/src/pages/user/[id].vue
+++ b/apps/frontend/src/pages/user/[id].vue
@@ -194,7 +194,7 @@
         </div>
       </div>
       <div class="normal-page__sidebar">
-        <AdPlaceholder />
+        <AdPlaceholder v-if="!auth.user || !isPermission(auth.user.badges, 1 << 0)" />
         <div class="card flex-card">
           <h2 class="text-lg text-contrast">{{ formatMessage(messages.profileDetails) }}</h2>
           <div class="flex items-center gap-2">