diff --git a/frontend/src/hooks/useStoreBucketInfo.ts b/frontend/src/hooks/useStoreBucketInfo.ts
new file mode 100644
index 00000000..5067b1a5
--- /dev/null
+++ b/frontend/src/hooks/useStoreBucketInfo.ts
@@ -0,0 +1,18 @@
+import { useEffect } from 'react'
+import { useBucketStore } from '../store/bucketStore'
+import { IBucketInfo } from '../interfaces'
+
+const useStoreBucketInfo = (bucketInfo: IBucketInfo | undefined) => {
+	const { addBucketState, resetAllState } = useBucketStore()
+	useEffect(() => {
+		resetAllState()
+		if (bucketInfo) {
+			addBucketState(bucketInfo)
+		}
+		return () => {
+			resetAllState()
+		}
+	}, [bucketInfo])
+}
+
+export default useStoreBucketInfo
diff --git a/frontend/src/pages/Bucket/BucketDetail/index.tsx b/frontend/src/pages/Bucket/BucketDetail/index.tsx
index ab682e6d..9aac0048 100644
--- a/frontend/src/pages/Bucket/BucketDetail/index.tsx
+++ b/frontend/src/pages/Bucket/BucketDetail/index.tsx
@@ -22,6 +22,7 @@ import { IBucketDetailInfo, IMenu, IMenuFunc } from '../../../interfaces'
 import { icons } from '../../../constants/header-icons'
 import BucketMoreButton from './component/BucketMoreButton'
 import { isMyUserType } from './../../../utils/typeFilter'
+import useStoreBucketInfo from '../../../hooks/useStoreBucketInfo'
 
 const BucketDetail = () => {
 	const [isInputShown, setIsInputShown] = useState(false)
@@ -44,6 +45,7 @@ const BucketDetail = () => {
 		queryKey: ['bucketInfo', bucketId],
 		queryFn: getBucketDetailInfo,
 	})
+	useStoreBucketInfo(bucketDetailInfo?.bucketInfo)
 
 	// :: Header
 	const bucketRightMenu =