* add .ms-2 on the first span for thread.latestReplierUid and `…

…<BadgeUser>` to display its `User.currentForumModerator` like `thread.authorUid` @ `<ThreadItem>`

* fix `margin-block-start` for `.sub-reply-group` has less specificity than `.bs-callout + .bs-callout` in `styles/bootstrapCallout.css` @ `<SubRepltGroup>`
@ components/Post/renderers/list

* fix still referencing the old shorthand route path `/p` after fd09268 @ useQueryForm.ts
- `routeNameSuffix.page`, also affected `<QueryForm>`
@ components/Post/queryForm

* now will display `FetchResponseError.bodyText` inside `<pre>` without parent `div.text-center` @ `<PlaceholderError>`

* fix cursor route path still testing against the old numeric page regex @ `withCursorRoute()`
@ router/index.ts

* disable the default three retry attempts before resulting in an error for `VueQueryPlugin`
* remove `.js` extension for rule `import/extensions`
@ main.ts
@ fe

* fix nullable field `content` @ Eloquent\Model\Post\Content\PostContent @ be

be/app/Eloquent/Model/Post/Content/PostContent.php

@@ -14,10 +14,10 @@ protected function protoBufBytes(): Attribute
     {
         return Attribute::make(
             /**
-             * @param resource $value
+             * @param resource|null $value
              * @return string
              */
-            get: static fn ($value) => stream_get_contents($value)
+            get: static fn ($value) => $value === null ? null : stream_get_contents($value)
         )->shouldCache();
     }
 }

be/app/Http/Controllers/PostsQuery.php

@@ -19,7 +19,7 @@ public function query(\Illuminate\Http\Request $request): array
         $validator = new ParamsValidator(Helper::jsonDecode(
             $request->validate([
                 'cursor' => [ // https://stackoverflow.com/questions/475074/regex-to-parse-or-validate-base64-data
-                    // (,|$)|,){6} means allow at most six parts of base64 segment or empty string to co-exist
+                    // (,|$)|,){5,6} means allow at most five or six components of base64 segment or empty string to exist
                     'regex:/^(([A-Za-z0-9-_]{4})*([A-Za-z0-9-_]{2,3})(,|$)|,){5,6}$/'
                 ],
                 'query' => 'json|required'

fe/src/components/Post/queryForm/QueryForm.vue

@@ -363,11 +363,11 @@ const parseRoute = (route: RouteLocationNormalized) => {
     assertRouteNameIsStr(route.name);
     uniqueParams.value = _.mapValues(uniqueParams.value, _.unary(fillParamDefaultValue)) as KnownUniqueParams;
     params.value = [];
-    const routeName = removeEnd(route.name, routeNameSuffix.page);
+    const routeName = removeEnd(route.name, routeNameSuffix.cursor);
 
     // parse route path to params
     if (routeName === 'post/param' && _.isArray(route.params.pathMatch)) {
-        parseParamRoute(route.params.pathMatch); // omit the page param from route full path
+        parseParamRoute(route.params.pathMatch); // omit the cursor param from route full path
     } else if (routeName === 'post/fid' && !_.isArray(route.params.fid)) {
         uniqueParams.value.fid.value = parseInt(route.params.fid);
     } else { // post id routes

fe/src/components/Post/queryForm/useQueryForm.ts

@@ -186,7 +186,7 @@ export default <
         ];
 
         return {
-            path: `/p/${flatParams // format param to url, e.g. name:value;subParamName:subParamValue...
+            path: `/posts/${flatParams // format param to url, e.g. name:value;subParamName:subParamValue...
                 .map(param =>
                     // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
                     `${param.name}:${tryEscapeParamValue(param.value)}${tryEncodeSubParamValue(param.subParam)}`)

fe/src/components/Post/renderers/list/SubReplyGroup.vue

@@ -50,7 +50,7 @@ const hoveringSubReplyID = ref(0);
 
 <style scoped>
 .sub-reply-group {
-    margin-block-start: .5rem;
+    margin-block-start: .5rem !important;
     margin-inline-start: .5rem;
     padding: .25rem;
 }

fe/src/components/Post/renderers/list/ThreadItem.vue

@@ -54,14 +54,16 @@
                     <BadgeUser v-if="getUser(thread.authorUid).currentForumModerator !== null"
                                :user="getUser(thread.authorUid)" />
                     <template v-if="thread.latestReplierUid === null">
-                        <span class="fw-normal link-secondary">最后回复：</span>
+                        <span class="ms-2 fw-normal link-secondary">最后回复：</span>
                         <span class="fw-bold link-dark">未知用户</span>
                     </template>
                     <template v-else-if="thread.latestReplierUid !== thread.authorUid">
                         <RouterLink :to="toUserRoute(thread.latestReplierUid)" class="ms-2">
-                            <span class="fw-normal link-secondary">最后回复：</span>
+                            <span class="ms-2 fw-normal link-secondary">最后回复：</span>
                             <span class="fw-bold link-dark">{{ renderUsername(thread.latestReplierUid) }}</span>
                         </RouterLink>
+                        <BadgeUser v-if="getUser(thread.latestReplierUid).currentForumModerator !== null"
+                                   :user="getUser(thread.latestReplierUid)" />
                     </template>
                     <BadgePostTime :time="thread.latestReplyPostedAt" tippyPrefix="最后回复时间：" badgeColor="secondary" />
                 </div>

fe/src/components/placeholders/PlaceholderError.vue

@@ -1,9 +1,9 @@
 <template>
-    <div class="text-center">
-        <template v-if="error instanceof FetchResponseError">
-            <p class="error-code text-muted">{{ error.bodyText }}</p>
-        </template>
-        <template v-else-if="error instanceof ApiResponseError">
+    <template v-if="error instanceof FetchResponseError">
+        <pre class="text-muted">{{ error.bodyText }}</pre>
+    </template>
+    <template v-else-if="error instanceof ApiResponseError">
+        <div class="text-center">
             <p class="error-code 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>
@@ -20,8 +20,8 @@
                     <template v-else>{{ paramError }}</template>
                 </p>
             </template>
-        </template>
-    </div>
+        </div>
+    </template>
 </template>
 
 <script setup lang="ts">

fe/src/main.ts

@@ -20,7 +20,7 @@ nprogress.configure({ trickleSpeed: 200 });
 
 if (import.meta.env.DEV) {
     // @ts-expect-error no .d.ts
-    await import('@/stats.js');
+    await import('@/stats');
     await import('@/checkCSS');
 }
 
@@ -40,9 +40,9 @@ if (googleAnalyticsMeasurementId !== '') {
     document.body.append(tag);
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
     // @ts-ignore
-    await import('@/gtag.js');
+    await import('@/gtag');
 }
 
 export const app = createApp(App).use(router).use(createHead()).use(createPinia())
-    .use(VueQueryPlugin, { queryClientConfig: { defaultOptions: { queries: { refetchOnWindowFocus: false } } } });
+    .use(VueQueryPlugin, { queryClientConfig: { defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } } });
 app.mount('#app');

fe/src/router/index.ts

@@ -22,7 +22,7 @@ export const assertRouteNameIsStr: (name: RouteLocationNormalized['name']) => as
 }; // https://github.com/microsoft/TypeScript/issues/34523#issuecomment-700491122
 export const compareRouteIsNewQuery = (to: RouteLocationNormalized, from: RouteLocationNormalized) =>
     !(_.isEqual(to.query, from.query) && _.isEqual(_.omit(to.params, 'cursor'), _.omit(from.params, 'cursor')));
-export const routeNameSuffix = { page: '+p', cursor: '+c' } as const;
+export const routeNameSuffix = { cursor: '/cursor' } as const;
 export const routeNameWithCursor = (name: string) =>
     (_.endsWith(name, routeNameSuffix.cursor) ? name : `${name}${routeNameSuffix.cursor}`);
 
@@ -60,8 +60,9 @@ const withChildrenRoute = (path: string, name: string, parentRoute: ParentRoute,
         } as RouteRecordSingleView | RouteRecordMultipleViews]
     });
 const withCursorRoute = (parentRoute: ParentRoute, path: string, name: string): ReturnType<typeof withChildrenRoute> =>
-    withChildrenRoute(path, name, parentRoute, {
-        path: 'cursor/:cursor(\\d+)',
+    withChildrenRoute(path, name, parentRoute, { // see `App\Http\Controllers\PostsQuery->query()` in be
+        // non capture group (?:) and escaping `)` is required for regex in vue route
+        path: 'cursor/:cursor((?:(?:[A-Za-z0-9-_]{4}\\)*(?:[A-Za-z0-9-_]{2,3}\\)(?:,|$\\)|,\\){5,6})',
         name: `${name}${routeNameSuffix.cursor}`
     });
 const withViewRoute = (lazyComponent: Promise<Component>, path: string): RouteRecordSingleView => ({