fix: search panel loading spinner bug

Signed-off-by: Innei <i@innei.in>
Innei · Feb 4, 2024 · 33fa4ba · 33fa4ba
1 parent 8844c36
commit 33fa4ba
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/src/components/modules/shared/SearchFAB.tsx b/src/components/modules/shared/SearchFAB.tsx
@@ -217,6 +217,7 @@ const SearchPanelImpl = () => {
  )
 
  const isLogged = useIsLogged()
+
  return (
  <m.div
  className={clsx(
@@ -266,9 +267,9 @@ const SearchPanelImpl = () => {
  <div className="flex flex-col items-center space-y-2">
  {!keyword ? (
  <i className="icon-[mingcute--search-line] text-[60px]" />
- ) : !isLoading ? (
+ ) : (
  <EmptyIcon />
- ) : null}
+ )}
 
  {!data && isLoading && isFetching && (
  <div className="loading-dots text-[30px]" />
@@ -281,6 +282,12 @@ const SearchPanelImpl = () => {
  return <SearchItem key={item.id} {...item} index={index} />
  })
  )}
+
+ {data.length === 0 && isLoading && (
+ <div className="flex h-full flex-grow center">
+ <div className="loading loading-spinner" />
+ </div>
+ )}
  </ul>
  </div>
 

diff --git a/src/hooks/common/use-input-composition.ts b/src/hooks/common/use-input-composition.ts
@@ -2,7 +2,7 @@ import { useCallback, useRef } from 'react'
 import type { CompositionEventHandler } from 'react'
 
 export const useInputComposition = (
- props:
+ props: Pick<
  | React.DetailedHTMLProps<
  React.InputHTMLAttributes<HTMLInputElement>,
  HTMLInputElement
@@ -11,6 +11,8 @@ export const useInputComposition = (
  React.TextareaHTMLAttributes<HTMLTextAreaElement>,
  HTMLTextAreaElement
  >,
+ 'onKeyDown' | 'onCompositionEnd' | 'onCompositionStart'
+ >,
 ) => {
  const { onKeyDown, onCompositionStart, onCompositionEnd } = props