feat: promote aeson

packages/website/src/components/AesonPlug.tsx

@@ -0,0 +1,32 @@
+import { imgur } from '@blitzkit/core';
+import { Flex, Heading, Link, Text } from '@radix-ui/themes';
+import { Var } from '../core/radix/var';
+
+export function AesonPlug() {
+  return (
+    <Link
+      color="gray"
+      highContrast
+      href="https://discord.gg/WHdER7ZPAD"
+      underline="hover"
+    >
+      <Flex
+        style={{
+          backgroundColor: Var('green-3'),
+          borderRadius: Var('radius-3'),
+          overflow: 'hidden',
+        }}
+      >
+        <img
+          src={imgur('akrxfFC')}
+          style={{ width: '6rem', height: '6rem', objectFit: 'cover' }}
+        />
+
+        <Flex py="3" px="5" direction="column" justify="center">
+          <Heading size="5">Preview brought to you by WoT Blitz News</Heading>
+          <Text color="gray">What the hell do I put here haha</Text>
+        </Flex>
+      </Flex>
+    </Link>
+  );
+}

packages/website/src/components/Tankopedia/CalloutsSection.tsx

@@ -1,15 +1,19 @@
+import { assertSecret } from '@blitzkit/core';
 import { MinusCircledIcon } from '@radix-ui/react-icons';
 import { Callout, Flex } from '@radix-ui/themes';
 import { uniq } from 'lodash-es';
 import { useEffect } from 'react';
 import { Duel } from '../../stores/duel';
 import { TankopediaPersistent } from '../../stores/tankopediaPersistent';
+import { AesonPlug } from '../AesonPlug';
 import { ExperimentIcon } from '../ExperimentIcon';
 import { MAX_RECENTLY_VIEWED } from '../TankSearch/constants';
 
 export function CalloutsSection() {
   const tank = Duel.use((state) => state.protagonist.tank);
   const mutateTankopediaPersistent = TankopediaPersistent.useMutation();
+  const promoteAeson =
+    assertSecret(import.meta.env.PUBLIC_ASSET_BRANCH) === 'preview';
 
   useEffect(() => {
     mutateTankopediaPersistent((draft) => {
@@ -20,10 +24,12 @@ export function CalloutsSection() {
     });
   }, [tank]);
 
-  if (!tank.testing && !tank.deprecated) return null;
+  if (!tank.testing && !tank.deprecated && !promoteAeson) return null;
 
   return (
     <Flex direction="column" align="center" gap="2" mb="4">
+      <AesonPlug />
+
       {tank.deprecated && (
         <Callout.Root color="red">
           <Callout.Icon>

packages/website/src/constants/tools.ts

@@ -30,7 +30,7 @@ export const tankopediaTool: Tool = {
     color: 'purple',
   },
   significant: true,
-  branches: ['main', 'dev', 'opentest'],
+  branches: ['main', 'dev', 'opentest', 'preview'],
 };
 
 // export const ratingTool: Tool = {
@@ -58,7 +58,7 @@ export const compareTool: Tool = {
     text: 'Compare tanks',
     color: 'crimson',
   },
-  branches: ['main', 'dev', 'opentest'],
+  branches: ['main', 'dev', 'opentest', 'preview'],
 };
 
 export const sessionTool: Tool = {
@@ -138,7 +138,7 @@ export const embedTool: Tool = {
     color: 'red',
   },
   image: 'Q0faRYg',
-  branches: ['main', 'dev', 'opentest'],
+  branches: ['main', 'dev'],
 };
 
 export const homeTool: Tool = {
@@ -173,7 +173,7 @@ export const tierListTool: Tool = {
     color: 'orange',
   },
   image: 'oKKc8Xv',
-  branches: ['main', 'dev'],
+  branches: ['main', 'dev', 'opentest', 'preview'],
 };
 
 export const TOOLS: Tool[] = [

packages/website/src/core/blitzkit/branches.ts

@@ -3,14 +3,17 @@ import { assertSecret } from '@blitzkit/core';
 const BRANCH_NAMES: Record<string, string> = {
   dev: 'beta',
   opentest: 'opentest',
+  preview: 'preview',
 };
 
 export function resolveBranchName() {
-  if (assertSecret(import.meta.env.MODE) === 'development') {
+  const secret = assertSecret(import.meta.env.PUBLIC_ASSET_BRANCH);
+  if (
+    assertSecret(import.meta.env.MODE) === 'development' &&
+    secret === 'dev'
+  ) {
     return 'dev';
   } else {
-    return BRANCH_NAMES[assertSecret(import.meta.env.PUBLIC_ASSET_BRANCH)] as
+    return BRANCH_NAMES[secret] as string | undefined;
-      | string
-      | undefined;
   }
 }

packages/website/src/pages/index.astro

@@ -1,5 +1,7 @@
 ---
+import { assertSecret } from '@blitzkit/core';
 import { Flex, Heading } from '@radix-ui/themes';
+import { AesonPlug } from '../components/AesonPlug';
 import HomeHero from '../components/HomeHero.astro';
 import { HomePageHotTanks } from '../components/HomePageHotTanks';
 import { Plugs } from '../components/Plugs.tsx';
@@ -16,6 +18,8 @@ import {
   tierListTool,
 } from '../constants/tools';
 import BaseLayout from '../layouts/BaseLayout.astro';
+
+const branch = assertSecret(import.meta.env.PUBLIC_ASSET_BRANCH);
 ---
 
 <BaseLayout>
@@ -23,6 +27,14 @@ import BaseLayout from '../layouts/BaseLayout.astro';
 
   <Plugs client:idle />
 
+  {
+    branch === 'preview' && (
+      <Flex justify="center" my="8" px="4">
+        <AesonPlug />
+      </Flex>
+    )
+  }
+
   <Flex p="4" justify="center" gap="4" mt="3">
     <Flex maxWidth="64rem" flexGrow="1" gap="4" direction="column">
       <ToolCard tool={tankopediaTool} />