feat: add index page for product landing page behind a feature flag

`/p` will only be reachable in `development` and `staging` environment

Author: marcel-bitfly

frontend/components/BcFeatureFlag.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import type { FeatureFlag } from '~/types/feature-flags'
-
 const props = defineProps<{
   feature: FeatureFlag,
 }>()

frontend/composables/useFeatureFlag.ts

@@ -1,20 +1,21 @@
-import type { FeatureFlag } from '~/types/feature-flags'
+export type FeatureFlag
+  = | 'feature-account_dashboards'
+    | 'feature-product-landing'
+    | 'feature-user_settings'
 
 export const useFeatureFlag = () => {
-  type Environment = 'development' | 'production' | 'staging'
-
-  const currentEnvironment = useRuntimeConfig().public.deploymentType as Environment
+  const currentEnvironment = useRuntimeConfig().public.deploymentType
   if (!currentEnvironment) {
     throw createError('Environment variable `deploymentType` is not provided.')
   }
 
-  const staging: FeatureFlag[] = []
+  const staging: FeatureFlag[] = [ 'feature-product-landing' ]
   const development: FeatureFlag[] = [
     ...staging,
     'feature-account_dashboards',
     'feature-user_settings',
   ]
-  const featureCatalog: Record<Environment, FeatureFlag[]> = {
+  const featureCatalog: Record<typeof currentEnvironment, FeatureFlag[]> = {
     development,
     production: [],
     staging,

frontend/index.d.ts

@@ -0,0 +1,6 @@
+declare module 'nuxt/schema' {
+  interface PublicRuntimeConfig {
+    deploymentType?: 'development' | 'production' | 'staging',
+  }
+}
+export {}

frontend/layers/products/app/pages/p/index.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <div>
+    <NuxtLayout name="base">
+      Product Landing Page
+      <div>
+        <BaseButton>
+          Get Started
+        </BaseButton>
+      </div>
+    </NuxtLayout>
+  </div>
+</template>

frontend/layers/products/nuxt.config.ts

@@ -0,0 +1,5 @@
+export default defineNuxtConfig({
+  $meta: {
+    name: 'products',
+  },
+})

frontend/middleware/redirect.global.ts

@@ -38,6 +38,12 @@ export default function ({
       return redirectToV1('/')
     case 'mobile':
       return redirectToV1('/mobile')
+    case 'p':
+    case 'product':
+      if (!has('feature-product-landing')) {
+        return abortNavigation()
+      }
+      break
     case 'privacy':
       return redirect('https://storage.googleapis.com/legal.beaconcha.in/privacy.pdf')
     case 'register':

frontend/nuxt.config.ts

@@ -60,7 +60,7 @@ export default defineNuxtConfig({
       apiClient: process.env.PUBLIC_API_CLIENT,
       apiKey: process.env.PUBLIC_API_KEY,
       chainIdByDefault: process.env.PUBLIC_CHAIN_ID_BY_DEFAULT,
-      deploymentType: process.env.PUBLIC_DEPLOYMENT_TYPE,
+      deploymentType: process.env.PUBLIC_DEPLOYMENT_TYPE as undefined,
       domain: process.env.PUBLIC_DOMAIN,
       gitVersion,
       isApiMocked: '',