fix(api tokens): show error message when the user tries to create an api token without at least one permission selected

frontend/src/i18n/lang/en.json

@@ -163,6 +163,7 @@
         "90d": "90 Days",
         "permissionExplanation": "Permissions allow you to scope what an api token is allowed to do.",
         "titleRequired": "The title is required",
+        "permissionRequired": "Please select at least one permission from the list.",
         "expired": "This token has expired {ago}.",
         "tokenCreatedSuccess": "Here is your new api token: {token}",
         "tokenCreatedNotSeeAgain": "Store it in a secure location, you won't see it again!",

frontend/src/views/user/settings/ApiTokens.vue

@@ -25,6 +25,7 @@ const newTokenExpiryCustom = ref(new Date())
 const newTokenPermissions = ref({})
 const newTokenPermissionsGroup = ref({})
 const newTokenTitleValid = ref(true)
+const newTokenPermissionValid = ref(true)
 const apiTokenTitle = ref()
 const tokenCreatedSuccessMessage = ref('')
 
@@ -89,13 +90,7 @@ async function createToken() {
 		return
 	}
 	
-	const expiry = Number(newTokenExpiry.value)
+	let hasPermissions = false
-	if (!isNaN(expiry)) {
-		// if it's a number, we assume it's the number of days in the future
-		newToken.value.expiresAt = new Date((+new Date()) + expiry * MILLISECONDS_A_DAY)
-	} else {
-		newToken.value.expiresAt = new Date(newTokenExpiryCustom.value)
-	}
 
 	newToken.value.permissions = {}
 	Object.entries(newTokenPermissions.value).forEach(([key, ps]) => {
@@ -105,9 +100,23 @@ async function createToken() {
 			.map(p => p[0])
 		if (all.length > 0) {
 			newToken.value.permissions[key] = all
+			hasPermissions = true
 		}
 	})
 	
+	if(!hasPermissions) {
+		newTokenPermissionValid.value = false
+		return
+	}
+	
+	const expiry = Number(newTokenExpiry.value)
+	if (!isNaN(expiry)) {
+		// if it's a number, we assume it's the number of days in the future
+		newToken.value.expiresAt = new Date((+new Date()) + expiry * MILLISECONDS_A_DAY)
+	} else {
+		newToken.value.expiresAt = new Date(newTokenExpiryCustom.value)
+	}
+
 	const token = await service.create(newToken.value)
 	tokenCreatedSuccessMessage.value = t('user.settings.apiTokens.tokenCreatedSuccess', {token: token.token})
 	newToken.value = new ApiTokenModel()
@@ -324,6 +333,12 @@ function toggleGroupPermissionsFromChild(group: string, checked: boolean) {
 				</div>
 			</div>
 
+			<p
+				v-if="!newTokenPermissionValid"
+				class="help is-danger"
+			>
+				{{ $t('user.settings.apiTokens.permissionRequired') }}
+			</p>
 			<XButton
 				:loading="service.loading"
 				@click="createToken"