feat: update versions table (#6502)

* feat: add new versions table, move environments column to be feature flag toggled, and add header/cell class props to Table.vue

* feat: implement much better table column widths

* feat: update version filter control to use multiselect

* feat: implement clicking table row to go to version

* feat: mobile pass on versions table

* feat: use multiselect for platform, and fix game version show all versions when dont exist

* pnpm prepr

* feat: replace dashboard projects table with new table

* feat: update projects so its out of card

* fix: version actions buttons column width

* feat: implement overflow on loaders cell

* update platform and version width

* feat: update project icon

* feat: change edit links to use floating action bar

* pnpm prepr

apps/app-frontend/src/pages/project/Versions.vue

@@ -5,16 +5,15 @@
 			:game-versions="gameVersions"
 			:versions="versions"
 			:project="project"
+			:show-environment-column="themeStore.featureFlags.show_version_environment_column"
 			:version-link="(version) => buildProjectHref(`/project/${project.id}/version/${version.id}`)"
 		>
 			<template #actions="{ version }">
-				<ButtonStyled circular type="transparent">
+				<ButtonStyled circular type="transparent" color="green">
 					<button
-						v-tooltip="`Install`"
-						:class="{
-							'group-hover:!bg-brand group-hover:[&>svg]:!text-brand-inverted':
-								!installed || version.id !== installedVersion,
-						}"
+						v-tooltip="
+							!installed ? 'Install' : version.id !== installedVersion ? 'Swap version' : ''
+						"
 						:disabled="installing || (installed && version.id === installedVersion)"
 						@click.stop="() => install(version.id)"
 					>
@@ -26,7 +25,6 @@
 				<ButtonStyled circular type="transparent">
 					<OverflowMenu
 						v-if="false"
-						class="group-hover:!bg-button-bg"
 						:options="[
 							{
 								id: 'install-elsewhere',
@@ -52,7 +50,6 @@
 					<a
 						v-else
 						v-tooltip="`Open in browser`"
-						class="group-hover:!bg-button-bg"
 						:href="`https://modrinth.com/${project.project_type}/${project.slug}/version/${version.id}`"
 						target="_blank"
 					>
@@ -77,6 +74,9 @@ import { useRoute } from 'vue-router'
 
 import { SwapIcon } from '@/assets/icons/index.js'
 import { get_game_versions, get_loaders } from '@/helpers/tags.js'
+import { useTheming } from '@/store/theme.ts'
+
+const themeStore = useTheming()
 
 defineProps({
 	project: {

apps/app-frontend/src/store/theme.ts

@@ -8,6 +8,7 @@ export const DEFAULT_FEATURE_FLAGS = {
 	worlds_tab: false,
 	worlds_in_home: true,
 	server_project_qa: false,
+	show_version_environment_column: false,
 	server_ram_as_bytes_always_on: false,
 	always_show_app_controls: false,
 	skip_non_essential_warnings: false,