diff --git a/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatPreviewSearchList.tsx b/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatPreviewSearchList.tsx
index be68b161d..2db58768e 100644
--- a/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatPreviewSearchList.tsx
+++ b/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatPreviewSearchList.tsx
@@ -1,19 +1,20 @@
 import { ChatPreviewSearchList } from '@pushprotocol/uiweb';
+import styled from 'styled-components';
 
 const ChatPreviewSearchListTest = () => {
   return (
     <>
-      <div
-        style={{
-          background: '#ffeded',
-          border: '1px solid rgb(226,8,128)',
-          height: '28.5vh',
-        }}
-      >
+      <Conatiner>
         <ChatPreviewSearchList searchParamter="0xFA3F8E79fb9B03e7a04295594785b91588Aa4DC8" />
-      </div>
+      </Conatiner>
     </>
   );
 };
 
 export default ChatPreviewSearchListTest;
+
+const Conatiner = styled.div`
+background: '#ffeded',
+border: '1px solid rgb(226,8,128)',
+height: '28.5vh',
+`;