feat: hosting access tab (#5995)

* feat: implement access tab with dummy data * fix: spacing * feat: qa * feat: implement backend * qa: qa pass * feat: fix user "search" * fix: lint * feat: change to bitfield * feat: fix fields * fix: lint * fix: lint * feat: hook up api * feat: fix permissions * feat: audit log table event start * feat: better mobile mode for audit log table * feat: i18n * feat: qa * feat: enforce permissions * feat: email template start * feat: qa * fix: tooltip bug * feat: qa * impl: sse support in api-client * feat: sse impl * fix: desync path * feat: time frame picker from analytics * feat: QA * fix: spacing * fix: permisison audit log entries * fix: hosting manage page shared server detection * fix: lint * feat: qa + lint * feat: audit log table sort by time * feat: finish frontend panel stuff * fix: lint * fix: backend alignment * fix: lint * fix: supress friend errors * feat: qa * fix: qa * fix: lint * fix: utils barrel * fix: safari cookies in dev * fix: pin nuxt * feat: fixes + notif fix * fix: notifications * feat: qa * fix: notification sync not happening immediately * fix: qa * fix: qa * feat: qa * blog + prepr * feat: toast shit * blog images * thumbnail update one last time * prepr * feat: use reinvite route * update images * fix: reinvite stuff * fix: lint * fix: alignment of save bar * fix: notif sizing * fix: split up access * fix: lint * fix: lint * fix: link --------- Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>
2026-08-28 10:34:53 +00:00 · 2026-06-04 15:58:01 +00:00
parent 58ad58f958
commit bd97ace974
227 changed files with 15578 additions and 2153 deletions
@@ -0,0 +1,123 @@
+<template>
+	<BaseEvent>
+		<IntlFormatted :message-id="message" :values="{ permissions: permissionLabel }">
+			<template #target-user>
+				<EventEntityLink :entity="targetUser" />
+			</template>
+			<template #permission-label="{ children }">
+				<span
+					v-if="permissionRole"
+					class="inline-flex h-7 items-center rounded-full border border-solid px-2.5 py-1 text-sm font-semibold leading-none align-middle"
+					:class="roleClasses(permissionRole)"
+				>
+					<component :is="() => children" />
+				</span>
+				<component :is="() => children" v-else />
+			</template>
+		</IntlFormatted>
+	</BaseEvent>
+</template>
+
+<script setup lang="ts">
+import type { Archon } from '@modrinth/api-client'
+import { computed } from 'vue'
+
+import { defineMessages, type MessageDescriptor, useVIntl } from '../../../../composables/i18n'
+import IntlFormatted from '../../../base/IntlFormatted.vue'
+import { apiPermissionsToAccessRole } from '../permissions'
+import type { ServerAccessRole } from '../types'
+import BaseEvent from './BaseEvent.vue'
+import EventEntityLink from './EventEntityLink.vue'
+import type { EventEntity } from './types'
+
+const props = defineProps<{
+	kind: 'invited' | 'invite_revoked' | 'permission_modified' | 'removed'
+	targetUser: EventEntity
+	permissions?: Archon.ServerUsers.v1.UserScope | null
+}>()
+
+const { formatMessage } = useVIntl()
+
+const messages = defineMessages({
+	invited: {
+		id: 'servers.audit-log.event.user-invited',
+		defaultMessage: 'Invited <target-user></target-user>',
+	},
+	invitedWithPermissions: {
+		id: 'servers.audit-log.event.user-invited-with-permissions',
+		defaultMessage:
+			'Invited <target-user></target-user> with <permission-label>{permissions}</permission-label>',
+	},
+	inviteRevoked: {
+		id: 'servers.audit-log.event.user-invite-revoked',
+		defaultMessage: 'Revoked invite for <target-user></target-user>',
+	},
+	permissionModified: {
+		id: 'servers.audit-log.event.user-permission-modified',
+		defaultMessage: 'Changed permissions for <target-user></target-user>',
+	},
+	permissionModifiedWithPermissions: {
+		id: 'servers.audit-log.event.user-permission-modified-with-permissions',
+		defaultMessage:
+			'Changed permissions for <target-user></target-user> to <permission-label>{permissions}</permission-label>',
+	},
+	removed: {
+		id: 'servers.audit-log.event.user-removed',
+		defaultMessage: 'Removed <target-user></target-user>',
+	},
+	ownerRole: {
+		id: 'servers.access-role.owner',
+		defaultMessage: 'Owner',
+	},
+	editorRole: {
+		id: 'servers.access-role.editor',
+		defaultMessage: 'Editor',
+	},
+	viewerRole: {
+		id: 'servers.access-role.viewer',
+		defaultMessage: 'Limited',
+	},
+})
+
+const roleMessages: Record<ServerAccessRole, MessageDescriptor> = {
+	owner: messages.ownerRole,
+	editor: messages.editorRole,
+	viewer: messages.viewerRole,
+}
+
+const message = computed(() => {
+	if (props.kind === 'invited') {
+		return permissionLabel.value ? messages.invitedWithPermissions : messages.invited
+	}
+	if (props.kind === 'invite_revoked') return messages.inviteRevoked
+	if (props.kind === 'permission_modified') {
+		return permissionLabel.value
+			? messages.permissionModifiedWithPermissions
+			: messages.permissionModified
+	}
+	return messages.removed
+})
+
+const permissionLabel = computed(() => {
+	const role = permissionRole.value
+	if (role) return formatMessage(roleMessages[role])
+	return ''
+})
+
+const permissionRole = computed(() =>
+	props.permissions == null || props.permissions === ''
+		? null
+		: apiPermissionsToAccessRole(props.permissions),
+)
+
+function roleClasses(role: ServerAccessRole): string {
+	switch (role) {
+		case 'owner':
+			return 'border-orange bg-highlight-orange text-orange'
+		case 'editor':
+			return 'border-green bg-highlight-green text-brand'
+		case 'viewer':
+			return 'border-blue bg-highlight-blue text-blue'
+	}
+}
+</script>