22import Welcome from "./components/Welcome" ;
33import AiAgent from "./components/AiAgent" ;
44import ChatWindow from "./components/ChatWindow" ;
5- import { useEffect , useState } from "react" ;
5+ import { useEffect , useMemo , useState } from "react" ;
66import { motion , AnimatePresence } from "framer-motion" ;
77import "react-toastify/dist/ReactToastify.css" ;
88import { ToastContainer } from "react-toastify" ;
99import ProjectManagement from "./components/ProjectManagement" ;
1010import AuthCard from "./components/Auth/AuthCard" ;
1111import { useAuthStore } from "./utils/store" ;
12+ import { playSound } from "./utils/playSound" ;
13+ import { getState , saveState } from "./utils/local" ;
1214
1315function App ( ) {
1416 const [ isShow , setIsShow ] = useState ( false ) ;
1517 const [ isLogin , setIsLogin ] = useState ( false ) ;
1618 const setAuth = useAuthStore ( ( s ) => s . setAuth ) ; // ambil setter dari store
17-
1819 const initSession = useAuthStore ( ( s ) => s . initSession ) ;
1920 const token = useAuthStore ( ( s ) => s . token ) ;
2021
2122 // untuk kontrol animasi splash logo
2223 const [ showLogo , setShowLogo ] = useState ( true ) ;
2324
25+ const KEY = "isPlaySound" ;
26+
27+ const [ isPlaySound , setIsPlaySound ] = useState < boolean > ( ( ) => {
28+ const fromLS = getState ( KEY ) ;
29+ return fromLS ?? false ; // fallback default false
30+ } ) ;
31+
32+ useEffect ( ( ) => {
33+ saveState ( KEY , isPlaySound ) ;
34+ } , [ isPlaySound ] ) ;
35+
2436 useEffect ( ( ) => {
2537 initSession ( ) ;
2638 } , [ isLogin ] ) ;
@@ -29,21 +41,13 @@ function App() {
2941 new Audio ( "/sounds/send.mp3" ) . load ( ) ;
3042 new Audio ( "/sounds/incoming.mp3" ) . load ( ) ;
3143 new Audio ( "/sounds/close.mp3" ) . load ( ) ;
32- setTimeout ( ( ) => {
33- playSound ( "/sounds/send.mp3" ) ;
34- } , 1000 ) ;
44+ playSound ( "/sounds/send.mp3" , isPlaySound ) ;
3545 } , [ ] ) ;
3646
3747 const onClose = ( ) => {
3848 setIsShow ( false ) ;
3949 } ;
4050
41- const playSound = ( src : string ) => {
42- const audio = new Audio ( src ) ;
43- audio . volume = 0.2 ;
44- audio . play ( ) . catch ( ( ) => { } ) ;
45- } ;
46-
4751 const handleAuth = ( r : any ) => {
4852 // r adalah AuthResult dari backend: { token, userId, teamMemberId?, ... }
4953 if ( ! r || ! r . token ) {
@@ -118,7 +122,10 @@ function App() {
118122 visible : { opacity : 1 , y : 0 , transition : { delay : 0.2 } } ,
119123 } }
120124 >
121- < ProjectManagement />
125+ < ProjectManagement
126+ setIsPlaySound = { setIsPlaySound }
127+ isPlaySound = { isPlaySound }
128+ />
122129 </ motion . div >
123130 </ motion . div >
124131 ) }
@@ -139,7 +146,13 @@ function App() {
139146 </ motion . div >
140147
141148 { ! isShow && < AiAgent setIsShow = { setIsShow } /> }
142- { isShow && < ChatWindow onClose = { onClose } /> }
149+ { isShow && (
150+ < ChatWindow
151+ onClose = { onClose }
152+ setIsPlaySound = { setIsPlaySound }
153+ isPlaySound = { isPlaySound }
154+ />
155+ ) }
143156 </ motion . div >
144157 ) }
145158
0 commit comments