Merge branch 'main' into relational-updates

app/src/interfaces/_system/tfa-setup/tfa-setup.vue

@@ -8,7 +8,7 @@
 			</template>
 		</v-checkbox>
 
-		<v-dialog persistent v-model="enableActive">
+		<v-dialog persistent v-model="enableActive" @esc="enableActive = false">
 			<v-card>
 				<template v-if="tfaEnabled === false" v-show="loading === false">
 					<v-card-title>

app/src/interfaces/code/index.ts

@@ -3,12 +3,24 @@ import InterfaceCode from './code.vue';
 import CodeMirror from 'codemirror';
 import 'codemirror/mode/meta';
 
-const choices = CodeMirror.modeInfo.map((e) => ({
-	text: e.name,
-	value: e.mode,
-}));
+const choicesMap = CodeMirror.modeInfo.reduce((acc: Record<string, string>, choice) => {
+	if (['JSON', 'JSON-LD'].includes(choice.name)) {
+		acc['JSON'] = 'JSON';
+		return acc;
+	}
 
-choices.push({ text: 'JSON', value: 'JSON' });
+	if (choice.mode in acc) {
+		acc[choice.mode] += ' / ' + choice.name;
+	} else {
+		acc[choice.mode] = choice.name;
+	}
+	return acc;
+}, {});
+
+const choices = Object.entries(choicesMap).map(([key, value]) => ({
+	text: value,
+	value: key,
+}));
 
 export default defineInterface(({ i18n }) => ({
 	id: 'code',

app/src/interfaces/file/file.vue

@@ -67,7 +67,7 @@
 			</v-list>
 		</v-menu>
 
-		<v-dialog :active="activeDialog === 'upload'" @toggle="activeDialog = null">
+		<v-dialog :active="activeDialog === 'upload'" @esc="activeDialog = null" @toggle="activeDialog = null">
 			<v-card>
 				<v-card-title>{{ $t('upload_from_device') }}</v-card-title>
 				<v-card-text>
@@ -86,7 +86,12 @@
 			@input="setSelection"
 		/>
 
-		<v-dialog :active="activeDialog === 'url'" @toggle="activeDialog = null" :persistent="urlLoading">
+		<v-dialog
+			:active="activeDialog === 'url'"
+			@toggle="activeDialog = null"
+			@esc="activeDialog = null"
+			:persistent="urlLoading"
+		>
 			<v-card>
 				<v-card-title>{{ $t('import_from_url') }}</v-card-title>
 				<v-card-text>

app/src/interfaces/icon/icon.vue

@@ -13,7 +13,14 @@
 				</template>
 
 				<template #append>
-					<v-icon @click="activate" name="expand_more" class="open-indicator" :class="{ open: active }" />
+					<v-icon v-if="value !== null" @click="setIcon(null)" name="close" />
+					<v-icon
+						v-else
+						@click="activate"
+						name="expand_more"
+						class="open-indicator"
+						:class="{ open: active }"
+					/>
 				</template>
 			</v-input>
 		</template>
@@ -83,7 +90,7 @@ export default defineComponent({
 			formatTitle,
 		};
 
-		function setIcon(icon: string) {
+		function setIcon(icon: string | null) {
 			emit('input', icon);
 		}
 	},