Fix ads showing with Modrinth PLus (#2187)

apps/frontend/src/components/ui/AdPlaceholder.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
+  <div class="ad-parent relative mb-3 flex w-full justify-center rounded-2xl bg-bg-raised">
-    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="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 () {

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"
           >

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.`;
 

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();

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>

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();
 

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">

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">

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([]);

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">