From ab826363ea4d585becb70d53778d45c0aa312403 Mon Sep 17 00:00:00 2001
From: Yidadaa <yidadaa@qq.com>
Date: Fri, 21 Apr 2023 23:37:25 +0800
Subject: [PATCH] fix: #965 improve loading animation

---
 app/components/home.module.scss | 5 ++++-
 app/components/home.tsx         | 7 ++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/components/home.module.scss b/app/components/home.module.scss
index 38e755bc..1c021d88 100644
--- a/app/components/home.module.scss
+++ b/app/components/home.module.scss
@@ -313,6 +313,10 @@
 .chat-message {
   display: flex;
   flex-direction: row;
+
+  &:last-child {
+    animation: slide-in ease 0.3s;
+  }
 }
 
 .chat-message-user {
@@ -325,7 +329,6 @@
   display: flex;
   flex-direction: column;
   align-items: flex-start;
-  animation: slide-in ease 0.3s;
 
   &:hover {
     .chat-message-top-actions {
diff --git a/app/components/home.tsx b/app/components/home.tsx
index 123be03a..ac3ce90e 100644
--- a/app/components/home.tsx
+++ b/app/components/home.tsx
@@ -2,7 +2,7 @@
 
 require("../polyfill");
 
-import { useState, useEffect } from "react";
+import { useState, useEffect, StyleHTMLAttributes } from "react";
 
 import styles from "./home.module.scss";
 
@@ -23,6 +23,7 @@ import {
   Route,
   useLocation,
 } from "react-router-dom";
+import { SideBar } from "./sidebar";
 
 export function Loading(props: { noLogo?: boolean }) {
   return (
@@ -37,10 +38,6 @@ const Settings = dynamic(async () => (await import("./settings")).Settings, {
   loading: () => <Loading noLogo />,
 });
 
-const SideBar = dynamic(async () => (await import("./sidebar")).SideBar, {
-  loading: () => <Loading noLogo />,
-});
-
 export function useSwitchTheme() {
   const config = useChatStore((state) => state.config);