replace enable/disable all buttons with toggles

locales/index.d.ts

@@ -13617,6 +13617,14 @@ export interface Locale extends ILocale {
      * Are you sure you want to create a token with no permissions?
      */
     "tokenHasNoPermissionsConfirm": string;
+    /**
+     * Enable all read-only permissions
+     */
+    "enableAllRead": string;
+    /**
+     * Enable all write/edit permissions
+     */
+    "enableAllWrite": string;
 }
 declare const locales: {
     [lang: string]: Locale;

packages/frontend/src/components/MkTokenGenerateWindow.vue

@@ -68,15 +68,19 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<template #label>{{ i18n.ts.permission }}</template>
 				<template #suffix>{{ permsCount || i18n.ts.none }}</template>
 
-				<div class="_gaps_s">
+				<div class="_gaps">
 					<div>{{ i18n.ts.permissionsDescription }}</div>
 
-					<div class="_buttons">
+					<div class="_gaps_s">
-						<MkButton inline @click="enableAll">{{ i18n.ts.enableAll }}</MkButton>
+						<MkSwitch v-model="enableAllRead">{{ i18n.ts.enableAllRead }}</MkSwitch>
-						<MkButton inline @click="disableAll">{{ i18n.ts.disableAll }}</MkButton>
+						<MkSwitch v-model="enableAllWrite">{{ i18n.ts.enableAllWrite }}</MkSwitch>
 					</div>
 
-					<MkSwitch v-for="kind in Object.keys(permissionSwitches)" :key="kind" v-model="permissionSwitches[kind]">{{ i18n.ts._permissions[kind] }}</MkSwitch>
+					<div :class="$style.divider"></div>
+
+					<div class="_gaps_s">
+						<MkSwitch v-for="kind in Object.keys(permissionSwitches)" :key="kind" v-model="permissionSwitches[kind]">{{ i18n.ts._permissions[kind] }}</MkSwitch>
+					</div>
 				</div>
 			</MkFolder>
 
@@ -84,22 +88,26 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<template #label>{{ i18n.ts.adminPermission }}</template>
 				<template #suffix>{{ adminPermsCount || i18n.ts.none }}</template>
 
-				<div class="_gaps_s">
+				<div class="_gaps">
 					<div>{{ i18n.ts.adminPermissionsDescription }}</div>
 
-					<div class="_buttons">
+					<div class="_gaps_s">
-						<MkButton inline :disabled="rank === 'user'" @click="enableAllAdmin">{{ i18n.ts.enableAll }}</MkButton>
+						<MkSwitch v-model="enableAllReadAdmin" :disabled="rank === 'user'">{{ i18n.ts.enableAllRead }}</MkSwitch>
-						<MkButton inline :disabled="rank === 'user'" @click="disableAllAdmin">{{ i18n.ts.disableAll }}</MkButton>
+						<MkSwitch v-model="enableAllWriteAdmin" :disabled="rank === 'user'">{{ i18n.ts.enableAllWrite }}</MkSwitch>
 					</div>
 
-					<MkSwitch
+					<div :class="$style.divider"></div>
-						v-for="kind in Object.keys(permissionSwitchesForAdmin)"
+
-						:key="kind"
+					<div class="_gaps_s">
-						v-model="permissionSwitchesForAdmin[kind]"
+						<MkSwitch
-						:disabled="rank === 'user'"
+							v-for="kind in Object.keys(permissionSwitchesForAdmin)"
-					>
+							:key="kind"
-						{{ i18n.ts._permissions[kind] }}
+							v-model="permissionSwitchesForAdmin[kind]"
-					</MkSwitch>
+							:disabled="rank === 'user'"
+						>
+							{{ i18n.ts._permissions[kind] }}
+						</MkSwitch>
+					</div>
 				</div>
 			</MkFolder>
 		</div>
@@ -142,7 +150,12 @@ const emit = defineEmits<{
 }>();
 
 const defaultPermissions = Misskey.permissions.filter(p => !p.startsWith('read:admin') && !p.startsWith('write:admin'));
+const defaultReadPermissions = defaultPermissions.filter(p => p.startsWith('read:'));
+const defaultWritePermissions = defaultPermissions.filter(p => p.startsWith('write:'));
+
 const adminPermissions = Misskey.permissions.filter(p => p.startsWith('read:admin') || p.startsWith('write:admin'));
+const adminReadPermissions = adminPermissions.filter(p => p.startsWith('read:'));
+const adminWritePermissions = adminPermissions.filter(p => p.startsWith('write:'));
 
 const dialog = useTemplateRef('dialog');
 const name = ref(props.initialName);
@@ -174,6 +187,42 @@ if (props.initialPermissions) {
 	}
 }
 
+const enableAllRead = computed({
+	get() {
+		return defaultReadPermissions.every(p => permissionSwitches.value[p]);
+	},
+	set(value: boolean) {
+		defaultReadPermissions.forEach(p => permissionSwitches.value[p] = value);
+	},
+});
+
+const enableAllWrite = computed({
+	get() {
+		return defaultWritePermissions.every(p => permissionSwitches.value[p]);
+	},
+	set(value: boolean) {
+		defaultWritePermissions.forEach(p => permissionSwitches.value[p] = value);
+	},
+});
+
+const enableAllReadAdmin = computed({
+	get() {
+		return adminReadPermissions.every(p => permissionSwitchesForAdmin.value[p]);
+	},
+	set(value: boolean) {
+		adminReadPermissions.forEach(p => permissionSwitchesForAdmin.value[p] = value);
+	},
+});
+
+const enableAllWriteAdmin = computed({
+	get() {
+		return adminWritePermissions.every(p => permissionSwitchesForAdmin.value[p]);
+	},
+	set(value: boolean) {
+		adminWritePermissions.forEach(p => permissionSwitchesForAdmin.value[p] = value);
+	},
+});
+
 async function ok(): Promise<void> {
 	if (props.withSharedAccess === true && grantees.value.length < 1) {
 		await os.alert({
@@ -207,34 +256,6 @@ async function ok(): Promise<void> {
 	dialog.value?.close();
 }
 
-function disableAll(): void {
-	for (const p in permissionSwitches.value) {
-		permissionSwitches.value[p] = false;
-	}
-}
-
-function disableAllAdmin(): void {
-	if (iAmAdmin) {
-		for (const p in permissionSwitchesForAdmin.value) {
-			permissionSwitchesForAdmin.value[p] = false;
-		}
-	}
-}
-
-function enableAll(): void {
-	for (const p in permissionSwitches.value) {
-		permissionSwitches.value[p] = true;
-	}
-}
-
-function enableAllAdmin(): void {
-	if (iAmAdmin) {
-		for (const p in permissionSwitchesForAdmin.value) {
-			permissionSwitchesForAdmin.value[p] = true;
-		}
-	}
-}
-
 async function addGrantee(): Promise<void> {
 	const user = await os.selectUser({
 		localOnly: true,
@@ -273,4 +294,8 @@ function removeGrantee(index: number) {
 .grantee > :first-child {
 	flex: 1;
 }
+
+.divider {
+	border-bottom: 1px solid var(--MI_THEME-divider);
+}
 </style>

sharkey-locales/en-US.yml

@@ -719,3 +719,5 @@ grantSharedAccessNoSelection2: "No shared access users were selected. Please add
 grantSharedAccessSuccess: "Shared access granted"
 grantSharedAccessSuccess2: "Shared access has been granted to {num} users."
 tokenHasNoPermissionsConfirm: "Are you sure you want to create a token with no permissions?"
+enableAllRead: "Enable all read-only permissions"
+enableAllWrite: "Enable all write/edit permissions"