diff --git a/docs/content.en/docs/release-notes/_index.md b/docs/content.en/docs/release-notes/_index.md
index b1380cae2bdf134f20dfa404c810968f87e297e0..0a914ed14fd31c96c429b3fbccbdcb86499f758d 100644
--- a/docs/content.en/docs/release-notes/_index.md
+++ b/docs/content.en/docs/release-notes/_index.md
@@ -17,7 +17,7 @@ Information about release notes of Coco Server is provided here.
 
 ### Improvements
 
-## 0.2.0 (2015-03-07)
+## 0.2.0 (2025-03-07)
 
 ### Features
 
@@ -55,7 +55,7 @@ Information about release notes of Coco Server is provided here.
 - etc.
 
 
-## 0.1.0 (2015-02-16)
+## 0.1.0 (2025-02-16)
 
 ### Features
 
diff --git a/package.json b/package.json
index f472b6a01cdada564454313278c4bfe5659e7b69..3d87591c9ac4d5be9b41fe77d7decebd508dce3f 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "coco",
   "private": true,
-  "version": "0.2.0-rc.1",
+  "version": "0.2.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
index 683df21a264bcb090844c211692e980e116cfd00..0f07b66bdf2cb0c03e9980dc33cc772378a132d6 100644
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -733,7 +733,7 @@ dependencies = [
 
 [[package]]
 name = "coco"
-version = "0.2.0-rc.1"
+version = "0.2.0"
 dependencies = [
  "applications",
  "async-trait",
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index 2d5d38c65ee872bd715573405b4640ef0b7bd9c0..18e926738cd7948fbf64b67df9345a5d6c303c06 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "coco"
-version = "0.2.0-rc.1"
+version = "0.2.0"
 description = "Search, connect, collaborate – all in one place."
 authors = ["INFINI Labs"]
 edition = "2021"
diff --git a/src/components/Assistant/ConnectPrompt.tsx b/src/components/Assistant/ConnectPrompt.tsx
index 05ff4b52d56432dab9567040ec25a88e8a3abe19..e3178741bd9c089e31009b2757fdc6c5f18fe7d5 100644
--- a/src/components/Assistant/ConnectPrompt.tsx
+++ b/src/components/Assistant/ConnectPrompt.tsx
@@ -8,9 +8,9 @@ import { useThemeStore } from "@/stores/themeStore";
 
 const ConnectPrompt = () => {
   const { t } = useTranslation();
-  const activeTheme = useThemeStore((state) => state.activeTheme);
+  const isDark = useThemeStore((state) => state.isDark);
 
-  const logo = activeTheme === "dark" ? LoginDark : LoginLight;
+  const logo = isDark ? LoginDark : LoginLight;
 
   const handleConnect = async () => {
     emit("open_settings", "connect");
diff --git a/src/components/Cloud/DataSourceItem.tsx b/src/components/Cloud/DataSourceItem.tsx
index 9cc11647690030e7a90658fc6e99b28b50bebd2d..d5ae128f2c80b0bdcf8b2f49b318a2728d1b4066 100644
--- a/src/components/Cloud/DataSourceItem.tsx
+++ b/src/components/Cloud/DataSourceItem.tsx
@@ -20,7 +20,7 @@ interface DataSourceItemProps {
 export function DataSourceItem({ name, connector }: DataSourceItemProps) {
   // const isConnected = true;
 
-  const activeTheme = useThemeStore((state) => state.activeTheme);
+  const isDark = useThemeStore((state) => state.isDark);
 
   const connector_data = useConnectStore((state) => state.connector_data);
   const endpoint_http = useAppStore((state) => state.endpoint_http);
@@ -42,9 +42,7 @@ export function DataSourceItem({ name, connector }: DataSourceItemProps) {
     const icons = connectorSource?.icon;
 
     if (!icons) {
-      return activeTheme === "dark"
-        ? source_default_dark_img
-        : source_default_img;
+      return isDark ? source_default_dark_img : source_default_img;
     }
 
     if (icons?.startsWith("http://") || icons?.startsWith("https://")) {
diff --git a/src/components/Settings/AboutView.tsx b/src/components/Settings/AboutView.tsx
index 81e5600dd097a3092a93217bd22e9486b412477a..6cf497899b29586604d56a5394597e1e94c17ae2 100644
--- a/src/components/Settings/AboutView.tsx
+++ b/src/components/Settings/AboutView.tsx
@@ -8,9 +8,9 @@ import { useThemeStore } from "@/stores/themeStore";
 
 export default function AboutView() {
   const { t } = useTranslation();
-  const activeTheme = useThemeStore((state) => state.activeTheme);
+  const isDark = useThemeStore((state) => state.isDark);
 
-  const logo = activeTheme === "dark" ? logoDark : logoLight;
+  const logo = isDark ? logoDark : logoLight;
 
   return (
     <div className="flex justify-center items-center flex-col h-[calc(100vh-170px)]">
diff --git a/src/routes/layout.tsx b/src/routes/layout.tsx
index bbf5780b64941c5bad2d4e531fd979db53fa2abd..ddbd4670f7280aa51c954435ec2a51787a2859be 100644
--- a/src/routes/layout.tsx
+++ b/src/routes/layout.tsx
@@ -18,6 +18,8 @@ export default function Layout() {
 
   const activeTheme = useThemeStore((state) => state.activeTheme);
   const setTheme = useThemeStore((state) => state.setTheme);
+  const isDark = useThemeStore((state) => state.isDark);
+  const setIsDark = useThemeStore((state) => state.setIsDark);
 
   function updateBodyClass(path: string) {
     const body = document.body;
@@ -34,10 +36,9 @@ export default function Layout() {
     });
 
     appWindow.onThemeChanged(({ payload }) => {
-      console.log("onThemeChanged", payload);
       if (activeTheme !== "auto") return;
 
-      setTheme(payload);
+      setIsDark(payload === "dark");
     });
   });
 
@@ -46,11 +47,19 @@ export default function Layout() {
 
     await appWindow.setTheme(nextTheme);
 
-    const root = window.document.documentElement;
-    root.className = nextTheme ?? "light";
-    root.dataset.theme = nextTheme ?? "light";
+    nextTheme = nextTheme ?? (await appWindow.theme());
+
+    setIsDark(nextTheme === "dark");
   }, [activeTheme]);
 
+  useEffect(() => {
+    const theme = isDark ? "dark" : "light";
+    const root = window.document.documentElement;
+
+    root.className = theme;
+    root.dataset.theme = theme;
+  }, [isDark]);
+
   useEffect(() => {
     updateBodyClass(location.pathname);
   }, [location.pathname]);
diff --git a/src/stores/themeStore.ts b/src/stores/themeStore.ts
index edea512ae6a47dab6622173d19fe433579c5c622..c7f4a7c312faf5593ff4a1634f41e0ae423436bf 100644
--- a/src/stores/themeStore.ts
+++ b/src/stores/themeStore.ts
@@ -9,6 +9,8 @@ export type IThemeStore = {
   themes: AppTheme[];
   activeTheme: AppTheme;
   setTheme: (theme: AppTheme) => void;
+  isDark: boolean;
+  setIsDark: (isDark: boolean) => void;
 };
 
 export const useThemeStore = create<IThemeStore>()(
@@ -17,6 +19,8 @@ export const useThemeStore = create<IThemeStore>()(
       themes: ["dark", "light", "auto"],
       activeTheme: "auto",
       setTheme: (activeTheme: AppTheme) => set(() => ({ activeTheme })),
+      isDark: false,
+      setIsDark: (isDark: boolean) => set(() => ({ isDark })),
     }),
     {
       name: "active-theme",