diff --git a/src/components/Search/InputBox.tsx b/src/components/Search/InputBox.tsx index bd6fa7ff..c63f5b54 100644 --- a/src/components/Search/InputBox.tsx +++ b/src/components/Search/InputBox.tsx @@ -133,9 +133,11 @@ export default function ChatInput({ const setVisibleStartPage = useConnectStore((state) => { return state.setVisibleStartPage; }); + const setBlurred = useAppStore((state) => state.setBlurred); useEffect(() => { const handleFocus = () => { + setBlurred(false); setIsCommandPressed(false); setModifierKeyPressed(false); }; diff --git a/src/components/SearchChat/index.tsx b/src/components/SearchChat/index.tsx index 7200184c..969e7cb7 100644 --- a/src/components/SearchChat/index.tsx +++ b/src/components/SearchChat/index.tsx @@ -76,6 +76,7 @@ function SearchChat({ isTyping, } = state; const [isWin10, setIsWin10] = useState(false); + const blurred = useAppStore((state) => state.blurred); useWindowEvents(); @@ -284,6 +285,7 @@ function SearchChat({ "rounded-xl": !isMobile && !isWin, "border border-[#E6E6E6] dark:border-[#272626]": isTauri && isLinux, "border-t border-t-[#999] dark:border-t-[#333]": isTauri && isWin10, + "opacity-30": blurred, } )} > diff --git a/src/hooks/useWindowEvents.ts b/src/hooks/useWindowEvents.ts index 3a5cd19f..f7f4a4dd 100644 --- a/src/hooks/useWindowEvents.ts +++ b/src/hooks/useWindowEvents.ts @@ -6,12 +6,13 @@ import platformAdapter from "@/utils/platformAdapter"; export function useWindowEvents() { const isPinned = useAppStore((state) => state.isPinned); const visible = useAppStore((state) => state.visible); + const setBlurred = useAppStore((state) => state.setBlurred); useEffect(() => { const handleBlur = async () => { console.log("Window blurred"); if (isPinned || visible) { - return; + return setBlurred(true); } await platformAdapter.hideWindow(); diff --git a/src/stores/appStore.ts b/src/stores/appStore.ts index 1ce67fba..b9837406 100644 --- a/src/stores/appStore.ts +++ b/src/stores/appStore.ts @@ -66,6 +66,9 @@ export type IAppStore = { visible: boolean; withVisibility: (fn: () => Promise) => Promise; + + blurred: boolean; + setBlurred: (blurred: boolean) => void; }; export const useAppStore = create()( @@ -150,6 +153,9 @@ export const useAppStore = create()( return result; }, + + blurred: false, + setBlurred: (blurred: boolean) => set({ blurred }), }), { name: "app-store",