Add new links card and feature flag system for incremental dev. (#1714)

* Add new links card and feature flag system for incremental dev.

* Switch to env variable for dev flags

* Add members card

* fix order of creators card

* Fix owner icon color and bring org owner to top of list

* lint + other fixes

* Revamp feature flag system, add flag config page

* Add button to flags page in dev mode

* fix env overrides

* make typescript happy with the refs

layouts/default.vue

@@ -125,6 +125,10 @@
                     <ModerationIcon class="icon" />
                     <span class="title">{{ formatMessage(commonMessages.moderationLabel) }}</span>
                   </NuxtLink>
+                  <NuxtLink v-if="flags.developerMode" class="item button-transparent" to="/flags">
+                    <ReportIcon class="icon" />
+                    <span class="title">Feature flags</span>
+                  </NuxtLink>
                   <NuxtLink
                     v-if="!cosmetics.hideModrinthAppPromos"
                     class="item button-transparent primary-color"
@@ -228,6 +232,10 @@
                 <ModerationIcon aria-hidden="true" />
                 {{ formatMessage(commonMessages.moderationLabel) }}
               </NuxtLink>
+              <NuxtLink v-if="flags.developerMode" class="iconified-button" to="/flags">
+                <ReportIcon aria-hidden="true" />
+                Feature flags
+              </NuxtLink>
             </template>
             <NuxtLink class="iconified-button" to="/settings">
               <SettingsIcon aria-hidden="true" />
@@ -411,7 +419,15 @@
   </div>
 </template>
 <script setup>
-import { LogInIcon, DownloadIcon, LibraryIcon, XIcon, IssuesIcon, Button } from 'omorphia'
+import {
+  LogInIcon,
+  DownloadIcon,
+  LibraryIcon,
+  XIcon,
+  IssuesIcon,
+  Button,
+  ReportIcon,
+} from 'omorphia'
 import HamburgerIcon from '~/assets/images/utils/hamburger.svg'
 import CrossIcon from '~/assets/images/utils/x.svg'
 import SearchIcon from '~/assets/images/utils/search.svg'
@@ -440,6 +456,7 @@ const { formatMessage } = useVIntl()
 const app = useNuxtApp()
 const auth = await useAuth()
 const cosmetics = useCosmetics()
+const flags = useFeatureFlags()
 const tags = useTags()
 
 const config = useRuntimeConfig()
@@ -663,9 +680,10 @@ watch(
 
 function developerModeIncrement() {
   if (developerModeCounter.value >= 5) {
-    cosmetics.value.developerMode = !cosmetics.value.developerMode
+    flags.value.developerMode = !flags.value.developerMode
     developerModeCounter.value = 0
-    if (cosmetics.value.developerMode) {
+    saveFeatureFlags()
+    if (flags.value.developerMode) {
       app.$notify({
         group: 'main',
         title: 'Developer mode activated',