feat: new modpack permissions system (#6005)

* Begin external projects moderator database frontend

* add copy link button

* begin project page permissions settings

* MEL database backend routes

* include filename in external files

* wip: when uploading a version file, fetch its overrides as a list

* wip: override license checks

* improve FileHost ref counting

* file host read capability

* scan files when inserting version file

* add dependency sha1 field

* clean up version files

* wip: attributions

* update s3 file host

* attribution scanning basic works

* works

* insert attribution info after resolving

* add routes

* remove dep sha1 stuff

* prepr

* wip: override file sources

* add files_missing_attributions to versions

* return extended version info + attributed at/by

* hook up frontend to backend (mostly)

* expose version date published

* withholding version visibility

* frontend work

* prepr

* use api-client for img upload

* moar frontend

* prepr

* Add schema to attribution resolution and Flame project results

* sqlx prepare

* changes

* remove feature flag, fix optional proof images

* fix schema

* fmt

* fix deletion and file fetch

* prepare

* fix admonition

* update frontend stuff to new schema

* prepr

* attribution on dependencies

* fixes

* sqlx prepare

* fixes

* routes

* fix routes

* Version grandfathering

* prepare

* wip: bulk routes

* pushing what i've got rn

* include link in NoPermission

* change hash insert to bulk route

* query flame even if entry in MEL

* delete file with weird name

* Prioritise putting override files in existing groups even with ExternalLicense

* fix how hex bytes are handled in route

* feat: coolbot moderation changes (#6215)

* Update moderator checklist

* move permissions stage order

* Updated nagContext.versions to v3, added nag for permissions

* Update permissions.vue default messages

* prepr

---------

Co-authored-by: coolbot100s <76798835+coolbot100s@users.noreply.github.com>

* QA

* prepr

* should group by project

* return attribution resolution correctly

* updated by moderator info

* Track what moderator reviewed an attribution moderation status

* default deser FMA field

* new version page

* clean up fetching + add a couple missing features

* qa items

* prepr

* provide moderation package stuff with DI

* format?

* don't redact moderated_at

* move supplementary resources

* Reorganize moderation messages.

* Quick replies for external content permissions.

* prepare

* QA

* allow exempting projects

* Ignore Flame projects which 404

* fix ci

* fix cross project attribution stuff

* Fix permission error

* change what files get cscanned

* add more logging

* QA Jun 22

* fix

* idempotency

* Expose route for rescanning

* update blog link

---------

Co-authored-by: aecsocket <aecsocket@tutanota.com>
Co-authored-by: coolbot100s <76798835+coolbot100s@users.noreply.github.com>
Co-authored-by: aecsocket <43144841+aecsocket@users.noreply.github.com>

packages/ui/src/components/base/Admonition.vue

@@ -80,7 +80,7 @@ import ButtonStyled from './ButtonStyled.vue'
 
 const props = withDefaults(
 	defineProps<{
-		type?: 'info' | 'warning' | 'critical' | 'success' | 'moderation'
+		type?: 'info' | 'warning' | 'critical' | 'success' | 'moderation' | 'circle-warning'
 		header?: string
 		body?: string
 		showActionsUnderneath?: boolean
@@ -139,6 +139,7 @@ const timestampTooltip = computed(() => {
 const typeClasses = {
 	info: 'border-brand-blue bg-bg-blue',
 	warning: 'border-brand-orange bg-bg-orange',
+	'circle-warning': 'border-brand-orange bg-bg-orange',
 	critical: 'border-brand-red bg-bg-red',
 	success: 'border-brand-green bg-bg-green',
 	moderation: 'border-brand-orange bg-bg-orange',
@@ -147,6 +148,7 @@ const typeClasses = {
 const iconClasses = {
 	info: 'text-brand-blue',
 	warning: 'text-brand-orange',
+	'circle-warning': 'text-brand-orange',
 	critical: 'text-brand-red',
 	success: 'text-brand-green',
 	moderation: 'text-brand-orange',
@@ -155,6 +157,7 @@ const iconClasses = {
 const buttonColors = {
 	info: 'blue',
 	warning: 'orange',
+	'circle-warning': 'orange',
 	critical: 'red',
 	success: 'green',
 	moderation: 'orange',
@@ -163,6 +166,7 @@ const buttonColors = {
 const progressTrackClasses = {
 	info: 'bg-brand-blue/20',
 	warning: 'bg-brand-orange/20',
+	'circle-warning': 'bg-brand-orange/20',
 	critical: 'bg-brand-red/20',
 	success: 'bg-brand-green/20',
 	moderation: 'bg-brand-orange/20',
@@ -171,6 +175,7 @@ const progressTrackClasses = {
 const progressFillClasses = {
 	info: 'bg-brand-blue',
 	warning: 'bg-brand-orange',
+	'circle-warning': 'bg-brand-orange',
 	critical: 'bg-brand-red',
 	success: 'bg-brand-green',
 	blue: 'bg-brand-blue',

packages/ui/src/components/base/AutoLink.vue

@@ -6,16 +6,23 @@
 		"
 		:to="to"
 		v-bind="$attrs"
+		:class="linkClass"
 	>
 		<slot />
 	</router-link>
-	<a v-else-if="typeof to === 'string' && to?.startsWith('http')" :href="to" v-bind="$attrs">
+	<a
+		v-else-if="typeof to === 'string' && to?.startsWith('http')"
+		:href="to"
+		v-bind="$attrs"
+		:class="linkClass"
+	>
 		<slot />
 	</a>
 	<button
 		v-else-if="typeof to === 'function'"
 		v-bind="$attrs"
 		class="inline bg-transparent border-none p-0 m-0 cursor-pointer"
+		:class="linkClass"
 		@click="to()"
 	>
 		<slot />
@@ -26,10 +33,16 @@
 </template>
 
 <script setup lang="ts">
-defineProps<{
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	to: any
-}>()
+withDefaults(
+	defineProps<{
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		to: any
+		linkClass?: string
+	}>(),
+	{
+		linkClass: '',
+	},
+)
 
 defineOptions({
 	inheritAttrs: false,

packages/ui/src/components/base/Checkbox.vue

@@ -1,5 +1,6 @@
 <template>
 	<button
+		type="button"
 		class="group bg-transparent border-none p-0 m-0 flex items-center text-left gap-3 checkbox-outer outline-offset-4 text-contrast"
 		:disabled="disabled"
 		:class="

packages/ui/src/components/base/FileInput.vue

@@ -96,7 +96,7 @@ label {
 		grid-gap: 0.5rem;
 		background-color: var(--color-button-bg);
 		border-radius: var(--radius-sm);
-		border: dashed 2px var(--color-contrast);
+		border: dashed 2px var(--color-secondary);
 		cursor: pointer;
 		color: var(--color-contrast);
 	}

packages/ui/src/components/base/OverflowMenu.vue

@@ -14,7 +14,7 @@
 				<div
 					v-if="isDivider(option)"
 					:key="`divider-${index}`"
-					class="h-px mx-3 my-2 bg-surface-5"
+					class="h-px mx-[0.625rem] my-2 bg-surface-5"
 				></div>
 				<Button
 					v-else
@@ -144,9 +144,6 @@ defineExpose({ open, close })
 	--text-color: var(--color-base);
 	--background-color: transparent;
 	justify-content: flex-start;
-
-	&:not(:last-child) {
-		margin-bottom: var(--gap-xs);
-	}
+	padding: 0.55rem 0.625rem;
 }
 </style>

packages/ui/src/components/base/Table.vue

@@ -32,7 +32,7 @@
 						<th
 							v-for="column in columns"
 							:key="column.key"
-							class="h-14 first:pl-4 last:pr-4"
+							class="h-12 first:pl-4 last:pr-4"
 							:class="[
 								`text-${column.align ?? 'left'}`,
 								column.enableSorting ? 'cursor-pointer select-none' : '',