From d27c740ab02b635da6ec7bb2d76835525009489e Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Mon, 1 Sep 2025 12:31:27 +0900
Subject: [PATCH] refactor

---
 .../src/pages/admin/overview.active-users.vue     |  7 +++++--
 .../src/pages/admin/overview.ap-requests.vue      | 15 ++++++++++-----
 .../src/pages/user/activity.following.vue         |  4 +++-
 .../frontend/src/pages/user/activity.notes.vue    |  4 +++-
 packages/frontend/src/pages/user/activity.pv.vue  |  6 +++---
 packages/frontend/src/utility/chart-legend.ts     |  4 +++-
 6 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/packages/frontend/src/pages/admin/overview.active-users.vue b/packages/frontend/src/pages/admin/overview.active-users.vue
index f74356599b..6c85f11cb1 100644
--- a/packages/frontend/src/pages/admin/overview.active-users.vue
+++ b/packages/frontend/src/pages/admin/overview.active-users.vue
@@ -37,6 +37,8 @@ async function renderChart() {
 		chartInstance.destroy();
 	}
 
+	if (chartEl.value == null) return;
+
 	const getDate = (ago: number) => {
 		const y = now.getFullYear();
 		const m = now.getMonth();
@@ -105,7 +107,6 @@ async function renderChart() {
 					type: 'time',
 					offset: true,
 					time: {
-						stepSize: 1,
 						unit: 'day',
 						displayFormats: {
 							day: 'M/d',
@@ -149,7 +150,9 @@ async function renderChart() {
 					},
 					external: externalTooltipHandler,
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor)],
diff --git a/packages/frontend/src/pages/admin/overview.ap-requests.vue b/packages/frontend/src/pages/admin/overview.ap-requests.vue
index 96ea4749dc..75f544c5a9 100644
--- a/packages/frontend/src/pages/admin/overview.ap-requests.vue
+++ b/packages/frontend/src/pages/admin/overview.ap-requests.vue
@@ -42,6 +42,9 @@ const { handler: externalTooltipHandler } = useChartTooltip();
 const { handler: externalTooltipHandler2 } = useChartTooltip();
 
 onMounted(async () => {
+	if (chartEl.value == null) return;
+	if (chartEl2.value == null) return;
+
 	const now = isChromatic() ? new Date('2024-08-31T10:00:00Z') : new Date();
 
 	const getDate = (ago: number) => {
@@ -122,7 +125,6 @@ onMounted(async () => {
 					stacked: true,
 					offset: false,
 					time: {
-						stepSize: 1,
 						unit: 'day',
 					},
 					grid: {
@@ -144,7 +146,7 @@ onMounted(async () => {
 					ticks: {
 						display: true,
 						//mirror: true,
-						callback: (value, index, values) => value < 0 ? -value : value,
+						callback: (value, index, values) => (value as number) < 0 ? -value : value,
 					},
 				},
 			},
@@ -173,7 +175,9 @@ onMounted(async () => {
 						label: context => `${context.dataset.label}: ${Math.abs(context.parsed.y)}`,
 					},
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor)],
@@ -213,7 +217,6 @@ onMounted(async () => {
 					type: 'time',
 					offset: false,
 					time: {
-						stepSize: 1,
 						unit: 'day',
 						displayFormats: {
 							day: 'M/d',
@@ -260,7 +263,9 @@ onMounted(async () => {
 					},
 					external: externalTooltipHandler2,
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor)],
diff --git a/packages/frontend/src/pages/user/activity.following.vue b/packages/frontend/src/pages/user/activity.following.vue
index d1cfa5356b..4310c7ad85 100644
--- a/packages/frontend/src/pages/user/activity.following.vue
+++ b/packages/frontend/src/pages/user/activity.following.vue
@@ -161,7 +161,9 @@ async function renderChart() {
 					},
 					external: externalTooltipHandler,
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],
diff --git a/packages/frontend/src/pages/user/activity.notes.vue b/packages/frontend/src/pages/user/activity.notes.vue
index 1cf7a00716..6d9c1bedd9 100644
--- a/packages/frontend/src/pages/user/activity.notes.vue
+++ b/packages/frontend/src/pages/user/activity.notes.vue
@@ -160,7 +160,9 @@ async function renderChart() {
 					},
 					external: externalTooltipHandler,
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],
diff --git a/packages/frontend/src/pages/user/activity.pv.vue b/packages/frontend/src/pages/user/activity.pv.vue
index 2539a6777b..76df53becd 100644
--- a/packages/frontend/src/pages/user/activity.pv.vue
+++ b/packages/frontend/src/pages/user/activity.pv.vue
@@ -154,8 +154,6 @@ async function renderChart() {
 					display: true,
 					text: 'Unique/Natural PV',
 					padding: {
-						left: 0,
-						right: 0,
 						top: 0,
 						bottom: 12,
 					},
@@ -171,7 +169,9 @@ async function renderChart() {
 					},
 					external: externalTooltipHandler,
 				},
-				gradient,
+				...({ // TSを黙らすため
+					gradient,
+				}),
 			},
 		},
 		plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],
diff --git a/packages/frontend/src/utility/chart-legend.ts b/packages/frontend/src/utility/chart-legend.ts
index fcbddf5669..490d6c4497 100644
--- a/packages/frontend/src/utility/chart-legend.ts
+++ b/packages/frontend/src/utility/chart-legend.ts
@@ -6,9 +6,11 @@
 import type { Plugin } from 'chart.js';
 import MkChartLegend from '@/components/MkChartLegend.vue';
 
-export const chartLegend = (legend: InstanceType<typeof MkChartLegend>) => ({
+export const chartLegend = (legend: InstanceType<typeof MkChartLegend> | null | undefined) => ({
 	id: 'htmlLegend',
 	afterUpdate(chart, args, options) {
+		if (legend == null) return;
+
 		// Reuse the built-in legendItems generator
 		const items = chart.options.plugins!.legend!.labels!.generateLabels!(chart);