💄 style: improve loading state

bentwnghk · Oct 7, 2023 · f00c868 · f00c868
1 parent b6246af
commit f00c868
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/app/market/features/AgentCard/index.tsx b/src/app/market/features/AgentCard/index.tsx
@@ -22,23 +22,23 @@ export interface AgentCardProps {
 const AgentCard = memo<AgentCardProps>(({ defaultAgents }) => {
   const { t } = useTranslation('market');
   const { mobile } = useResponsive();
-  const clientAgentList = useMarketStore(agentMarketSelectors.getAgentList);
-
-  const agentList = clientAgentList.length === 0 && defaultAgents ? defaultAgents : clientAgentList;
+  const { styles } = useStyles();
 
   const [useFetchAgentList, keywords] = useMarketStore((s) => [
     s.useFetchAgentList,
     s.searchKeywords,
   ]);
-  const { styles } = useStyles();
-  const { isLoading } = useFetchAgentList();
+  useFetchAgentList();
+
+  const clientAgentList = useMarketStore(agentMarketSelectors.getAgentList);
+  const agentList = clientAgentList.length === 0 && defaultAgents ? defaultAgents : clientAgentList;
 
   const agentListData = useMemo(() => {
     if (!keywords) return agentList;
     return agentList.filter(({ meta }) => JSON.stringify(meta).toLowerCase().includes(keywords));
   }, [agentList, keywords]);
 
-  if (isLoading || !agentList) return <Loading />;
+  if (agentList.length === 0) return <Loading />;
 
   return (
     <Flexbox gap={mobile ? 16 : 24}>