From b0c0ef55aba4b7a87eae62275d9e648ac0b35e21 Mon Sep 17 00:00:00 2001
From: n0099 <n@n0099.net>
Date: Wed, 14 Feb 2024 16:31:09 +0800
Subject: [PATCH] * suffix all old references to types now extending `Api` with
 `['response']` or `['queryParam']`

* exporting type `ApiErrorClass` and classes that it referring @ index.ts
* fix extending `CursorPagination['pages']` in type `ApiPosts` @ index.d.ts
@ api
* change type of prop `error` to `ApiErrorClass` @ `<PlaceholderError>`

* rename prop `isFetchingPosts` to `isLoading`, partial revert d3eb4e2d7ce10804aada8751425fcf9629056bd6 @ `<QueryForm>`
@ fe
---
 fe/src/api/index.d.ts                               |  9 +++++----
 fe/src/api/index.ts                                 |  6 +++---
 fe/src/components/Post/PostNav.vue                  |  2 +-
 fe/src/components/Post/PostPage.vue                 |  2 +-
 fe/src/components/Post/queryForm/QueryForm.vue      |  6 +++---
 fe/src/components/Post/renderers/RendererList.vue   |  6 +++---
 fe/src/components/Post/renderers/RendererTable.vue  |  6 +++---
 fe/src/components/User/UserPage.vue                 |  2 +-
 fe/src/components/placeholders/PlaceholderError.vue | 10 +++++++---
 fe/src/views/Post.vue                               |  2 +-
 fe/src/views/Stats.vue                              |  4 ++--
 fe/src/views/Status.vue                             |  6 +++---
 fe/src/views/User.vue                               |  2 +-
 13 files changed, 34 insertions(+), 29 deletions(-)

diff --git a/fe/src/api/index.d.ts b/fe/src/api/index.d.ts
index 180e49e3..bd1ddb2b 100644
--- a/fe/src/api/index.d.ts
+++ b/fe/src/api/index.d.ts
@@ -59,10 +59,11 @@ export type ApiUsers = Api<
 >;
 
 export type JsonString = string;
-export type ApiPosts = Api<CursorPagination<{
-    matchQueryPostCount: { [P in PostType]: UInt },
-    notMatchQueryParentPostCount: { [P in Omit<PostType, 'subRely'>]: UInt }
-}> & {
+export type ApiPosts = Api<CursorPagination & {
+    pages: {
+        matchQueryPostCount: { [P in PostType]: UInt },
+        notMatchQueryParentPostCount: { [P in Omit<PostType, 'subRely'>]: UInt }
+    },
     type: 'index' | 'search',
     forum: Pick<ApiForums[number], 'fid' | 'name'>,
     threads: Array<Thread & {
diff --git a/fe/src/api/index.ts b/fe/src/api/index.ts
index 17eae30c..3cfc175c 100644
--- a/fe/src/api/index.ts
+++ b/fe/src/api/index.ts
@@ -5,7 +5,7 @@ import nprogress from 'nprogress';
 import { stringify } from 'qs';
 import * as _ from 'lodash-es';
 
-class ApiResponseError extends Error {
+export class ApiResponseError extends Error {
     public constructor(
         public readonly errorCode: number,
         public readonly errorInfo: Record<string, unknown[]> | string
@@ -13,7 +13,7 @@ class ApiResponseError extends Error {
         super(JSON.stringify({ errorCode, errorInfo }));
     }
 }
-class FetchResponseError extends Error {
+export class FetchResponseError extends Error {
     public constructor(public readonly response: Response) {
         super(JSON.stringify(response));
     }
@@ -74,7 +74,7 @@ const getRequesterWithReCAPTCHA = <TResponse, TQueryParam>
             { ...queryParam as TQueryParam, ...await reCAPTCHACheck(action) }
         )(queryContext);
 
-type ApiErrorClass = ApiResponseError | FetchResponseError;
+export type ApiErrorClass = ApiResponseError | FetchResponseError;
 type ReqesuterGetter = typeof getRequester | typeof getRequesterWithReCAPTCHA;
 const useApi = <
     TApi extends Api<TResponse, TQueryParam>,
diff --git a/fe/src/components/Post/PostNav.vue b/fe/src/components/Post/PostNav.vue
index dc9bd676..ae3958de 100644
--- a/fe/src/components/Post/PostNav.vue
+++ b/fe/src/components/Post/PostNav.vue
@@ -58,7 +58,7 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import scrollIntoView from 'scroll-into-view-if-needed';
 import * as _ from 'lodash-es';
 
-const props = defineProps<{ postPages: ApiPosts[] }>();
+const props = defineProps<{ postPages: Array<ApiPosts['response']> }>();
 const route = useRoute();
 const router = useRouter();
 const elementRefsStore = useElementRefsStore();
diff --git a/fe/src/components/Post/PostPage.vue b/fe/src/components/Post/PostPage.vue
index 7a17dd4a..fbcd1122 100644
--- a/fe/src/components/Post/PostPage.vue
+++ b/fe/src/components/Post/PostPage.vue
@@ -16,7 +16,7 @@ import type { ApiPosts } from '@/api/index.d';
 import type { RouteLocationNormalized } from 'vue-router';
 
 const props = defineProps<{
-    posts: ApiPosts,
+    posts: ApiPosts['response'],
     renderType: PostRenderer,
     currentRoute: RouteLocationNormalized,
     isLoadingNewPage: boolean,
diff --git a/fe/src/components/Post/queryForm/QueryForm.vue b/fe/src/components/Post/queryForm/QueryForm.vue
index cc7bea93..7fe55773 100644
--- a/fe/src/components/Post/queryForm/QueryForm.vue
+++ b/fe/src/components/Post/queryForm/QueryForm.vue
@@ -154,8 +154,8 @@
             <SelectParam @paramChange="e => addParam(e)" />
         </div>
         <div class="row mt-3">
-            <button :disabled="isFetchingPosts" class="col-auto btn btn-primary" type="submit">
-                查询 <span v-show="isFetchingPosts" class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true" />
+            <button :disabled="isLoading" class="col-auto btn btn-primary" type="submit">
+                查询 <span v-show="isLoading" class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true" />
             </button>
             <span class="col-auto ms-3 my-auto text-muted">{{ currentQueryTypeDescription }}</span>
         </div>
@@ -185,7 +185,7 @@ import { RangePicker } from 'ant-design-vue';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import * as _ from 'lodash-es';
 
-defineProps<{ isFetchingPosts: boolean }>();
+defineProps<{ isLoading: boolean }>();
 const router = useRouter();
 const {
     uniqueParams,
diff --git a/fe/src/components/Post/renderers/RendererList.vue b/fe/src/components/Post/renderers/RendererList.vue
index 9e31cc44..7cfd4f8b 100644
--- a/fe/src/components/Post/renderers/RendererList.vue
+++ b/fe/src/components/Post/renderers/RendererList.vue
@@ -176,7 +176,7 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import { DateTime } from 'luxon';
 import * as _ from 'lodash-es';
 
-const props = defineProps<{ initialPosts: ApiPosts }>();
+const props = defineProps<{ initialPosts: ApiPosts['response'] }>();
 const elementRefsStore = useElementRefsStore();
 const replyElements = ref<HTMLElement[]>([]);
 const hoveringSubReplyID = ref(0);
@@ -184,7 +184,7 @@ const getUser = baseGetUser(props.initialPosts.users);
 const renderUsername = baseRenderUsername(getUser);
 const userRoute = (uid: BaiduUserID) => ({ name: 'user/uid', params: { uid } });
 const posts = computed(() => {
-    const newPosts = props.initialPosts as Modify<ApiPosts, { // https://github.com/microsoft/TypeScript/issues/33591
+    const newPosts = props.initialPosts as Modify<ApiPosts['response'], { // https://github.com/microsoft/TypeScript/issues/33591
         threads: Array<Thread & { replies: Array<Reply & { subReplies: Array<SubReply | SubReply[]> }> }>
     }>;
     newPosts.threads = newPosts.threads.map(thread => {
@@ -215,7 +215,7 @@ const posts = computed(() => {
         return thread;
     });
 
-    return newPosts as Modify<ApiPosts, {
+    return newPosts as Modify<ApiPosts['response'], {
         threads: Array<Thread & { replies: Array<Reply & { subReplies: SubReply[][] }> }>
     }>;
 });
diff --git a/fe/src/components/Post/renderers/RendererTable.vue b/fe/src/components/Post/renderers/RendererTable.vue
index e146e9a9..6a18dd4e 100644
--- a/fe/src/components/Post/renderers/RendererTable.vue
+++ b/fe/src/components/Post/renderers/RendererTable.vue
@@ -97,9 +97,9 @@ import { Table } from 'ant-design-vue';
 import type { ColumnType } from 'ant-design-vue/es/table/interface';
 import * as _ from 'lodash-es';
 
-const props = defineProps<{ posts: ApiPosts }>();
-const threads = ref<ApiPosts['threads']>();
-const repliesKeyByTid = ref<Record<Tid, ApiPosts['threads'][number]['replies']>>([]);
+const props = defineProps<{ posts: ApiPosts['response'] }>();
+const threads = ref<ApiPosts['response']['threads']>();
+const repliesKeyByTid = ref<Record<Tid, ApiPosts['response']['threads'][number]['replies']>>([]);
 const subRepliesKeyByPid = ref<Record<Pid, SubReply[]>>([]);
 const threadColumns = ref<ColumnType[]>([
     { title: 'tid', dataIndex: 'tid' },
diff --git a/fe/src/components/User/UserPage.vue b/fe/src/components/User/UserPage.vue
index a6c5724a..0a23e32a 100644
--- a/fe/src/components/User/UserPage.vue
+++ b/fe/src/components/User/UserPage.vue
@@ -26,7 +26,7 @@ import type { UserGender } from '@/api/user';
 import { toUserPortraitImageUrl } from '@/shared';
 
 const props = defineProps<{
-    users: ApiUsers,
+    users: ApiUsers['response'],
     isLoadingNewPage: boolean,
     isLastPageInPages: boolean
 }>();
diff --git a/fe/src/components/placeholders/PlaceholderError.vue b/fe/src/components/placeholders/PlaceholderError.vue
index db3d5123..6235cce0 100644
--- a/fe/src/components/placeholders/PlaceholderError.vue
+++ b/fe/src/components/placeholders/PlaceholderError.vue
@@ -3,7 +3,10 @@
         <template v-if="error === null">
             <span class="errorCode text-muted">error</span>
         </template>
-        <template v-else>
+        <template v-else-if="error instanceof FetchResponseError">
+            <p class="errorCode text-muted">{{ error.response }}</p>
+        </template>
+        <template v-else-if="error instanceof ApiResponseError">
             <p class="errorCode text-muted">{{ error.errorCode }}</p>
             <template v-if="_.isString(error.errorInfo)">
                 <p v-for="(info, _k) in error.errorInfo.split('\n')" :key="_k">{{ info }}</p>
@@ -22,10 +25,11 @@
 </template>
 
 <script setup lang="ts">
-import type { ApiError } from '@/api/index.d';
+import type { ApiErrorClass } from '@/api';
+import { ApiResponseError, FetchResponseError } from '@/api';
 import * as _ from 'lodash-es';
 
-defineProps<{ error: ApiError | null }>();
+defineProps<{ error: ApiErrorClass | null }>();
 </script>
 
 <style scoped>
diff --git a/fe/src/views/Post.vue b/fe/src/views/Post.vue
index f3172072..ef9d936d 100644
--- a/fe/src/views/Post.vue
+++ b/fe/src/views/Post.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="container">
-        <QueryForm ref="queryFormRef" :isFetchingPosts="isFetching" />
+        <QueryForm ref="queryFormRef" :isLoading="isFetching" />
         <p>当前页数：{{ getRouteCursorParam(route) }}</p>
         <Menu v-show="!_.isEmpty(postPages)" v-model:selectedKeys="selectedRenderTypes" mode="horizontal">
             <MenuItem key="list">列表视图</MenuItem>
diff --git a/fe/src/views/Stats.vue b/fe/src/views/Stats.vue
index 70ab06a5..a43017b5 100644
--- a/fe/src/views/Stats.vue
+++ b/fe/src/views/Stats.vue
@@ -44,7 +44,7 @@ import TimeGranularity from '@/components/widgets/TimeGranularity.vue';
 import TimeRange from '@/components/widgets/TimeRange.vue';
 
 import { apiForums, apiStatsForumsPostCount, throwIfApiError } from '@/api';
-import type { ApiForums, ApiStatsForumPostCountQueryParam } from '@/api/index.d';
+import type { ApiForums, ApiStatsForumPostCount } from '@/api/index.d';
 import type { Writable } from '@/shared';
 import { titleTemplate } from '@/shared';
 import { emptyChartSeriesData, extendCommonToolbox, timeGranularities, timeGranularityAxisPointerLabelFormatter, timeGranularityAxisType } from '@/shared/echarts';
@@ -111,7 +111,7 @@ const chartInitialOption: echarts.ComposeOption<DataZoomComponentOption | GridCo
 };
 
 useHead({ title: titleTemplate('统计') });
-const query = ref<ApiStatsForumPostCountQueryParam>({
+const query = ref<ApiStatsForumPostCount['queryParam']>({
     fid: 0,
     timeGranularity: 'day',
     startTime: 0,
diff --git a/fe/src/views/Status.vue b/fe/src/views/Status.vue
index f3982448..77658b7b 100644
--- a/fe/src/views/Status.vue
+++ b/fe/src/views/Status.vue
@@ -36,7 +36,7 @@ import TimeGranularity from '@/components/widgets/TimeGranularity.vue';
 import TimeRange from '@/components/widgets/TimeRange.vue';
 
 import { apiStatus, throwIfApiError } from '@/api';
-import type { ApiStatus, ApiStatusQueryParam } from '@/api/index.d';
+import type { ApiStatus, ApiStatus } from '@/api/index.d';
 import { titleTemplate } from '@/shared';
 import { commonToolboxFeatures, emptyChartSeriesData } from '@/shared/echarts';
 
@@ -167,7 +167,7 @@ const chartInitialOption: echarts.ComposeOption<DataZoomComponentOption | GridCo
 };
 
 useHead({ title: titleTemplate('状态') });
-const query = ref<ApiStatusQueryParam>({
+const query = ref<ApiStatus['queryParam']>({
     timeGranularity: 'minute',
     startTime: 0,
     endTime: 0
@@ -189,7 +189,7 @@ const submitQueryForm = async () => {
         .finally(() => { chartEl.value?.classList.remove('loading') }));
     const series = _.chain(chartInitialOption.series)
         .map('id')
-        .map((seriesName: keyof ApiStatus[0]) => ({
+        .map((seriesName: keyof ApiStatus['response'][0]) => ({
             id: seriesName,
 
             // select column from status, UnixTimestamp * 1000 since echarts only accepts milliseconds
diff --git a/fe/src/views/User.vue b/fe/src/views/User.vue
index 7736682b..8a86e809 100644
--- a/fe/src/views/User.vue
+++ b/fe/src/views/User.vue
@@ -38,7 +38,7 @@ const route = useRoute();
 useHead({ title: titleTemplate('用户查询') });
 const params = ref<Pick<SelectUserParams, Exclude<SelectUserBy, '' | 'displayNameNULL' | 'nameNULL'>>>({});
 const selectUserBy = ref<SelectUserBy>('');
-const userPages = ref<ApiUsers[]>([]);
+const userPages = ref<Array<ApiUsers['response']>>([]);
 const isLoading = ref<boolean>(false);
 const lastFetchError = ref<ApiError | null>(null);
 const showPlaceholderPostList = ref<boolean>(false);