fix(ui/no_comment): always appears when creating comment

ArtalkJS · Feb 3, 2024 · 17033dc · 17033dc
1 parent 559df60
commit 17033dc
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 13 deletions.
diff --git a/ui/artalk/src/lib/ui.ts b/ui/artalk/src/lib/ui.ts
@@ -7,7 +7,7 @@ export function showLoading(parentElem: HTMLElement, conf?: { transparentBg?: bo
   let $loading = parentElem.querySelector<HTMLElement>(':scope > .atk-loading')
   if (!$loading) {
     $loading = Utils.createElement(
-    `<div class="atk-loading atk-fade-in" style="display: none;">
+    `<div class="atk-loading" style="display: none;">
       <div class="atk-loading-spinner">
         <svg viewBox="25 25 50 50"><circle cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"></circle></svg>
       </div>
@@ -22,7 +22,7 @@ export function showLoading(parentElem: HTMLElement, conf?: { transparentBg?: bo
   if ($spinner) {
     $spinner.style.display = 'none'
     window.setTimeout(() => {
-      $spinner.style.display = ''
+      if ($spinner.isConnected) $spinner.style.display = ''
     }, 500)
   }
 }

diff --git a/ui/artalk/src/list/paginator/index.ts b/ui/artalk/src/list/paginator/index.ts
@@ -18,7 +18,7 @@ export interface Paginator {
   showErr?(msg: string): void
   getHasMore(): boolean
   /** Clear comments when fetch new page data */
-  getIsClearComments(params: Partial<ListFetchParams>): boolean
+  getIsClearComments(params: { offset?: number }): boolean
   dispose(): void
 }
 

diff --git a/ui/artalk/src/list/paginator/read-more.ts b/ui/artalk/src/list/paginator/read-more.ts
@@ -56,7 +56,7 @@ export default class ReadMorePaginator implements Paginator {
     return this.instance.hasMore
   }
 
-  getIsClearComments(params: Partial<ListFetchParams>): boolean {
+  getIsClearComments(params: { offset?: number }): boolean {
     return params.offset === 0
   }
 

diff --git a/ui/artalk/src/plugins/list/no-comment.ts b/ui/artalk/src/plugins/list/no-comment.ts
@@ -3,14 +3,7 @@ import * as Utils from '@/lib/utils'
 import { sanitize } from '@/lib/sanitizer'
 
 export const NoComment: ArtalkPlugin = (ctx) => {
-  let isFetching = false
-  ctx.on('list-fetch', (params) => {
-    isFetching = true
-  })
-
   ctx.on('list-loaded', (comments) => {
-    if (!isFetching) return // Skip before fetch (e.g. clear all comments before fetch)
-    isFetching = false
     const list = ctx.get('list')!
 
     // 无评论

diff --git a/ui/artalk/src/types/event.ts b/ui/artalk/src/types/event.ts
@@ -16,9 +16,9 @@ export interface EventPayloadMap {
   'conf-fetch': undefined          // 配置请求时
   'list-fetch': Partial<ListFetchParams>    // 评论列表请求时
   'list-fetched': ListFetchedArgs           // 评论列表请求后
-  'list-load': CommentData[]     // 评论装载前
+  'list-load': CommentData[]     // 评论装载前 (list-load payload is partial comments)
 
-  'list-loaded': CommentData[]     // 评论装载后
+  'list-loaded': CommentData[]     // 评论装载后 (list-loaded payload is full comments)
   'list-failed': ErrorData          // 评论加载错误时
 
   'list-goto-first': undefined    // 评论列表归位时