From 511dab061874c62987cd9b4be8298a98a858d1e7 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Mon, 10 Apr 2023 18:56:38 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20webhook,=20=E9=80=A3=E6=90=BA?=
 =?UTF-8?q?=E3=82=A2=E3=83=97=E3=83=AA=E4=B8=80=E8=A6=A7=E3=81=A7=E3=82=B3?=
 =?UTF-8?q?=E3=83=B3=E3=83=86=E3=83=B3=E3=83=84=E3=81=8C=E9=87=8D=E8=A4=87?=
 =?UTF-8?q?=E3=81=97=E3=81=A6=E8=A1=A8=E7=A4=BA=E3=81=95=E3=82=8C=E3=82=8B?=
 =?UTF-8?q?=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix #10564
---
 CHANGELOG.md                                  |  1 +
 packages/frontend/src/pages/settings/apps.vue | 45 ++++++++++---------
 .../frontend/src/pages/settings/webhook.vue   | 29 ++++++------
 3 files changed, 41 insertions(+), 34 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 683ee3db8..56e34427c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,6 +20,7 @@
 ### Client
 - 常に広告を見られるオプションを追加
 - ユーザーページの画像一覧が表示されない問題を修正
+- webhook, 連携アプリ一覧でコンテンツが重複して表示される問題を修正
 
 ### Server
 - アンテナのノート、チャンネルのノート、通知が正常に作成できないことがある問題を修正
diff --git a/packages/frontend/src/pages/settings/apps.vue b/packages/frontend/src/pages/settings/apps.vue
index 955d81215..599d6329e 100644
--- a/packages/frontend/src/pages/settings/apps.vue
+++ b/packages/frontend/src/pages/settings/apps.vue
@@ -8,27 +8,29 @@
 			</div>
 		</template>
 		<template #default="{items}">
-			<div v-for="token in items" :key="token.id" class="_panel bfomjevm">
-				<img v-if="token.iconUrl" class="icon" :src="token.iconUrl" alt=""/>
-				<div class="body">
-					<div class="name">{{ token.name }}</div>
-					<div class="description">{{ token.description }}</div>
-					<MkKeyValue oneline>
-						<template #key>{{ i18n.ts.installedDate }}</template>
-						<template #value><MkTime :time="token.createdAt"/></template>
-					</MkKeyValue>
-					<MkKeyValue oneline>
-						<template #key>{{ i18n.ts.lastUsedDate }}</template>
-						<template #value><MkTime :time="token.lastUsedAt"/></template>
-					</MkKeyValue>
-					<details>
-						<summary>{{ i18n.ts.details }}</summary>
-						<ul>
-							<li v-for="p in token.permission" :key="p">{{ i18n.t(`_permissions.${p}`) }}</li>
-						</ul>
-					</details>
-					<div class="actions">
-						<MkButton inline danger @click="revoke(token)"><i class="ti ti-trash"></i></MkButton>
+			<div class="_gaps">
+				<div v-for="token in items" :key="token.id" class="_panel bfomjevm">
+					<img v-if="token.iconUrl" class="icon" :src="token.iconUrl" alt=""/>
+					<div class="body">
+						<div class="name">{{ token.name }}</div>
+						<div class="description">{{ token.description }}</div>
+						<MkKeyValue oneline>
+							<template #key>{{ i18n.ts.installedDate }}</template>
+							<template #value><MkTime :time="token.createdAt"/></template>
+						</MkKeyValue>
+						<MkKeyValue oneline>
+							<template #key>{{ i18n.ts.lastUsedDate }}</template>
+							<template #value><MkTime :time="token.lastUsedAt"/></template>
+						</MkKeyValue>
+						<details>
+							<summary>{{ i18n.ts.details }}</summary>
+							<ul>
+								<li v-for="p in token.permission" :key="p">{{ i18n.t(`_permissions.${p}`) }}</li>
+							</ul>
+						</details>
+						<div class="actions">
+							<MkButton inline danger @click="revoke(token)"><i class="ti ti-trash"></i></MkButton>
+						</div>
 					</div>
 				</div>
 			</div>
@@ -51,6 +53,7 @@ const list = ref<any>(null);
 const pagination = {
 	endpoint: 'i/apps' as const,
 	limit: 100,
+	noPaging: true,
 	params: {
 		sort: '+lastUsedAt',
 	},
diff --git a/packages/frontend/src/pages/settings/webhook.vue b/packages/frontend/src/pages/settings/webhook.vue
index bc729ab87..4f702758f 100644
--- a/packages/frontend/src/pages/settings/webhook.vue
+++ b/packages/frontend/src/pages/settings/webhook.vue
@@ -7,18 +7,20 @@
 	<FormSection>
 		<MkPagination :pagination="pagination">
 			<template #default="{items}">
-				<FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit/${webhook.id}`" class="_margin">
-					<template #icon>
-						<i v-if="webhook.active === false" class="ti ti-player-pause"></i>
-						<i v-else-if="webhook.latestStatus === null" class="ti ti-circle"></i>
-						<i v-else-if="[200, 201, 204].includes(webhook.latestStatus)" class="ti ti-check" :style="{ color: 'var(--success)' }"></i>
-						<i v-else class="ti ti-alert-triangle" :style="{ color: 'var(--error)' }"></i>
-					</template>
-					{{ webhook.name || webhook.url }}
-					<template #suffix>
-						<MkTime v-if="webhook.latestSentAt" :time="webhook.latestSentAt"></MkTime>
-					</template>
-				</FormLink>
+				<div class="_gaps">
+					<FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit/${webhook.id}`">
+						<template #icon>
+							<i v-if="webhook.active === false" class="ti ti-player-pause"></i>
+							<i v-else-if="webhook.latestStatus === null" class="ti ti-circle"></i>
+							<i v-else-if="[200, 201, 204].includes(webhook.latestStatus)" class="ti ti-check" :style="{ color: 'var(--success)' }"></i>
+							<i v-else class="ti ti-alert-triangle" :style="{ color: 'var(--error)' }"></i>
+						</template>
+						{{ webhook.name || webhook.url }}
+						<template #suffix>
+							<MkTime v-if="webhook.latestSentAt" :time="webhook.latestSentAt"></MkTime>
+						</template>
+					</FormLink>
+				</div>
 			</template>
 		</MkPagination>
 	</FormSection>
@@ -35,7 +37,8 @@ import { i18n } from '@/i18n';
 
 const pagination = {
 	endpoint: 'i/webhooks/list' as const,
-	limit: 10,
+	limit: 100,
+	noPaging: true,
 };
 
 const headerActions = $computed(() => []);