Improve API console

3 files changed, 46 insertions, 2 deletions

diff --git a/src/client/app/common/views/components/settings/api.vue b/src/client/app/common/views/components/settings/api.vue
index 74e3eb0661..184fa069fb 100644
--- a/src/client/app/common/views/components/settings/api.vue
+++ b/src/client/app/common/views/components/settings/api.vue
@@ -14,7 +14,7 @@
 
 	<section>
 		<header><fa icon="terminal"/> {{ $t('console.title') }}</header>
-		<ui-input v-model="endpoint" :datalist="endpoints">
+		<ui-input v-model="endpoint" :datalist="endpoints" @change="onEndpointChange()">
 			<span>{{ $t('console.endpoint') }}</span>
 		</ui-input>
 		<ui-textarea v-model="body">
@@ -80,6 +80,22 @@ export default Vue.extend({
 				this.sending = false;
 				this.res = JSON5.stringify(err, null, 2);
 			});
+		},
+
+		onEndpointChange() {
+			this.$root.api('endpoint', { endpoint: this.endpoint }).then(endpoint => {
+				const body = {};
+				for (const p of endpoint.params) {
+					body[p.name] =
+						p.type === 'String' ? '' :
+						p.type === 'Number' ? 0 :
+						p.type === 'Boolean' ? false :
+						p.type === 'Array' ? [] :
+						p.type === 'Object' ? {} :
+						null;
+				}
+				this.body = JSON5.stringify(body, null, 2);
+			});
 		}
 	}
 });
diff --git a/src/client/app/common/views/components/ui/input.vue b/src/client/app/common/views/components/ui/input.vue
index bcb87398ba..645062df28 100644
--- a/src/client/app/common/views/components/ui/input.vue
+++ b/src/client/app/common/views/components/ui/input.vue
@@ -23,6 +23,7 @@
 				@focus="focused = true"
 				@blur="focused = false"
 				@keydown="$emit('keydown', $event)"
+				@change="$emit('change', $event)"
 				:list="id"
 			>
 			<input v-else ref="input"
@@ -38,6 +39,7 @@
 				@focus="focused = true"
 				@blur="focused = false"
 				@keydown="$emit('keydown', $event)"
+				@change="$emit('change', $event)"
 				:list="id"
 			>
 			<datalist :id="id" v-if="datalist">
@@ -60,7 +62,7 @@
 		<div class="suffix" ref="suffix"><slot name="suffix"></slot></div>
 	</div>
 	<div class="toggle" v-if="withPasswordToggle">
-		<a @click='togglePassword'>
+		<a @click="togglePassword">
 			<span v-if="type == 'password'"><fa :icon="['fa', 'eye']"/> {{ $t('@.show-password') }}</span>
 			<span v-if="type != 'password'"><fa :icon="['far', 'eye-slash']"/> {{ $t('@.hide-password') }}</span>
 		</a>
diff --git a/src/server/api/endpoints/endpoint.ts b/src/server/api/endpoints/endpoint.ts
new file mode 100644
index 0000000000..48e78cd04c
--- /dev/null
+++ b/src/server/api/endpoints/endpoint.ts
@@ -0,0 +1,26 @@
+import $ from 'cafy';
+import define from '../define';
+import endpoints from '../endpoints';
+
+export const meta = {
+	requireCredential: false,
+
+	tags: ['meta'],
+
+	params: {
+		endpoint: {
+			validator: $.str,
+		}
+	},
+};
+
+export default define(meta, async (ps) => {
+	const ep = endpoints.find(x => x.name === ps.endpoint);
+	if (ep == null) return null;
+	return {
+		params: Object.entries(ep.meta.params || {}).map(([k, v]) => ({
+			name: k,
+			type: v.validator.name === 'ID' ? 'String' : v.validator.name
+		}))
+	};
+});