Try tweaking settings/theme for Windows. Setting the theme didn't work.

package.json

@@ -4,7 +4,7 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "start": "npm run build:plugins && npm run tauri-dev:desktop",
+    "start": "npm run tauri-dev:desktop",
     "tauri-dev:desktop": "tauri dev --no-watch --config ./src-tauri/tauri-dev.conf.json",
     "tauri-dev:ios": "tauri ios dev --no-watch --config ./src-tauri/tauri-dev.conf.json",
     "tauri-build": "tauri build",

src-tauri/Cargo.lock

@@ -3317,9 +3317,9 @@ dependencies = [
 
 [[package]]
 name = "muda"
-version = "0.13.1"
+version = "0.13.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f428b4e9db3d17e2f809dfb1ff9ddfbbf16c71790d1656d10aee320877e1392f"
+checksum = "86b959f97c97044e4c96e32e1db292a7d594449546a3c6b77ae613dc3a5b5145"
 dependencies = [
  "cocoa",
  "crossbeam-channel",
@@ -5836,9 +5836,9 @@ checksum = "14c39fd04924ca3a864207c66fc2cd7d22d7c016007f9ce846cbb9326331930a"
 
 [[package]]
 name = "tauri"
-version = "2.0.0-beta.20"
+version = "2.0.0-beta.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9f44a74520aa677a4461787902b31373d431749b017862203d39df151892ecb1"
+checksum = "5a258ecc5ac7ddade525f512c4962fd01cd0f5265e917b4572579c32c027bb31"
 dependencies = [
  "anyhow",
  "bytes",
@@ -5886,9 +5886,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-build"
-version = "2.0.0-beta.16"
+version = "2.0.0-beta.17"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1a6829341dde141cd48caabd4f57463444fb1127e7e20e758088be12e866bd77"
+checksum = "82b964bb6d03d97e24e12f896aab463b02a3c2ff76a60f728cc37b5548eb470e"
 dependencies = [
  "anyhow",
  "cargo_toml",
@@ -5908,9 +5908,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-codegen"
-version = "2.0.0-beta.16"
+version = "2.0.0-beta.17"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "de94afa2ee0cc6a7ba99c1300b80a9ede416c54a6a68a0ad38c3ebe1d6fe547c"
+checksum = "3529cfa977ed7c097f2a5e8da19ecffbe61982450a6c819e6165b6d0cfd3dd3a"
 dependencies = [
  "base64 0.22.0",
  "brotli",
@@ -5935,9 +5935,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-macros"
-version = "2.0.0-beta.16"
+version = "2.0.0-beta.17"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "305a13d6164bd76f9b407cd1b95031deb1c1a0804c686f5e332a99ee62710ac2"
+checksum = "36f97dd80334f29314aa5f40b5fad10cb9feffd08e5a5324fd728613841e5d33"
 dependencies = [
  "heck 0.5.0",
  "proc-macro2",
@@ -6134,9 +6134,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-runtime"
-version = "2.0.0-beta.17"
+version = "2.0.0-beta.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "42e81dc86660cc1421af7967e71857201d8ebf114327465bde819913a27bffc1"
+checksum = "d7dc96172a43536236ab55b7da7b8461bf75810985e668589e2395cb476937cb"
 dependencies = [
  "dpi",
  "gtk",
@@ -6153,9 +6153,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-runtime-wry"
-version = "2.0.0-beta.17"
+version = "2.0.0-beta.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "23beea1d1540fe23c33a0791aeba1054f51d84faadc07ff8637b7e5494eba9fa"
+checksum = "5d4fd913b1f14a9b618c7f3ae35656d3aa759767fcb95b72006357c12b9d0b09"
 dependencies = [
  "cocoa",
  "gtk",
@@ -6177,16 +6177,15 @@ dependencies = [
 
 [[package]]
 name = "tauri-utils"
-version = "2.0.0-beta.16"
+version = "2.0.0-beta.17"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "199edb0e8969f53decfb683971faa50eb8b421f9034bfa95121286e1e93beaef"
+checksum = "4f24a9c20d676a3f025331cc1c3841256ba88c9f25fb7fae709d2b3089c50d90"
 dependencies = [
  "brotli",
  "cargo_metadata",
  "ctor",
  "dunce",
  "glob",
- "heck 0.5.0",
  "html5ever",
  "infer",
  "json-patch",
@@ -6655,9 +6654,9 @@ dependencies = [
 
 [[package]]
 name = "tray-icon"
-version = "0.13.4"
+version = "0.14.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a97ec55956c54569e74209ae9d29a7a79193b252d17a6ac28bcffd4c11a384ad"
+checksum = "c53e41ee5fa70d22d0c11ab780beef179944e7d3199b948f5f6fbe7f7debe3b5"
 dependencies = [
  "cocoa",
  "core-graphics",

src-tauri/Cargo.toml

@@ -41,7 +41,7 @@ reqwest = { version = "0.11.23", features = ["multipart", "cookies", "gzip", "br
 serde = { version = "1.0.198", features = ["derive"] }
 serde_json = { version = "1.0.116", features = ["raw_value"] }
 sqlx = { version = "0.7.4", features = ["sqlite", "runtime-tokio-rustls", "json", "chrono", "time"] }
-tauri = { version = "2.0.0-beta.19", features = ["config-toml", "devtools", "protocol-asset"] }
+tauri = { version = "2.0.0-beta.22", features = ["config-toml", "devtools", "protocol-asset"] }
 tauri-plugin-clipboard-manager = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2" }
 tauri-plugin-dialog = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2" }
 tauri-plugin-log = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2", features = ["colored"] }

src-tauri/src/lib.rs

@@ -1818,7 +1818,7 @@ fn create_window(handle: &AppHandle, url: &str) -> WebviewWindow {
             .resizable(true)
             .fullscreen(false)
             .disable_drag_drop_handler() // Required for frontend Dnd on windows
-            .inner_size(DEFAULT_WINDOW_WIDTH as f64, DEFAULT_WINDOW_HEIGHT as f64)
+            .inner_size(DEFAULT_WINDOW_WIDTH, DEFAULT_WINDOW_HEIGHT)
             .position(
                 // Randomly offset so windows don't stack exactly
                 100.0 + random::<f64>() * 30.0,
@@ -1839,7 +1839,7 @@ fn create_window(handle: &AppHandle, url: &str) -> WebviewWindow {
     #[cfg(not(target_os = "macos"))]
     {
         // Doesn't seem to work from Rust, here, so we do it in main.tsx
-        // win_builder = win_builder.decorations(false);
+        win_builder = win_builder.decorations(false);
     }
 
     let win = win_builder.build().expect("failed to build window");

src-tauri/src/tauri_plugin_windows_window.rs

@@ -1,20 +1,21 @@
 use hex_color::HexColor;
-use tauri::{ Runtime, Window};
+use tauri::{Manager, Runtime, Window, WindowEvent};
 
 use std::mem::transmute;
-use std::{ptr, ffi::c_void, mem::size_of};
+use std::{ffi::c_void, mem::size_of, ptr};
 use tauri::plugin::{Builder, TauriPlugin};
 
-use windows::Win32::UI::Controls::{WTA_NONCLIENT, WTNCA_NODRAWICON, WTNCA_NOSYSMENU, WTNCA_NOMIRRORHELP};
+use windows::Win32::UI::Controls::{
+    WTA_NONCLIENT, WTNCA_NODRAWICON, WTNCA_NOMIRRORHELP, WTNCA_NOSYSMENU,
+};
 
+use windows::Win32::Foundation::COLORREF;
+use windows::Win32::Foundation::{BOOL, HWND};
+use windows::Win32::Graphics::Dwm::DwmSetWindowAttribute;
+use windows::Win32::Graphics::Dwm::DWMWA_CAPTION_COLOR;
+use windows::Win32::Graphics::Dwm::DWMWA_USE_IMMERSIVE_DARK_MODE;
 use windows::Win32::UI::Controls::SetWindowThemeAttribute;
 use windows::Win32::UI::Controls::WTNCA_NODRAWCAPTION;
-use windows::Win32::Graphics::Dwm::DWMWA_CAPTION_COLOR;
-use windows::Win32::Foundation::COLORREF;
-use windows::Win32::Foundation::BOOL;
-use windows::Win32::Graphics::Dwm::DwmSetWindowAttribute;
-use windows::Win32::Foundation::HWND;
-use windows::Win32::Graphics::Dwm::{DWMWA_USE_IMMERSIVE_DARK_MODE};
 
 pub fn init<R: Runtime>() -> TauriPlugin<R> {
     Builder::new("windows_window")
@@ -28,19 +29,18 @@ pub fn init<R: Runtime>() -> TauriPlugin<R> {
 
 fn hex_color_to_colorref(color: HexColor) -> COLORREF {
     // TODO: Remove this unsafe, This operation doesn't need to be unsafe!
-    unsafe {
+    unsafe { COLORREF(transmute::<[u8; 4], u32>([color.r, color.g, color.b, 0])) }
-        COLORREF(transmute::<[u8; 4], u32>([color.r, color.g, color.b, 0]))
-    }
 }
 
 struct WinThemeAttribute {
+    #[allow(dead_code)]
     flag: u32,
-    mask: u32
+    #[allow(dead_code)]
+    mask: u32,
 }
 
 #[cfg(target_os = "windows")]
 fn update_bg_color(hwnd: &HWND, bg_color: HexColor) {
-
     let use_dark_mode = BOOL::from(true);
 
     let final_color = hex_color_to_colorref(bg_color);
@@ -50,26 +50,29 @@ fn update_bg_color(hwnd: &HWND, bg_color: HexColor) {
             HWND(hwnd.0),
             DWMWA_USE_IMMERSIVE_DARK_MODE,
             ptr::addr_of!(use_dark_mode) as *const c_void,
-            size_of::<BOOL>().try_into().unwrap()
+            size_of::<BOOL>().try_into().unwrap(),
-        ).unwrap();
+        )
+        .unwrap();
 
         DwmSetWindowAttribute(
             HWND(hwnd.0),
             DWMWA_CAPTION_COLOR,
             ptr::addr_of!(final_color) as *const c_void,
-            size_of::<COLORREF>().try_into().unwrap()
+            size_of::<COLORREF>().try_into().unwrap(),
-        ).unwrap();
+        )
+        .unwrap();
 
         let flags = WTNCA_NODRAWCAPTION | WTNCA_NODRAWICON;
-        let mask  = WTNCA_NODRAWCAPTION | WTNCA_NODRAWICON | WTNCA_NOSYSMENU | WTNCA_NOMIRRORHELP;
+        let mask = WTNCA_NODRAWCAPTION | WTNCA_NODRAWICON | WTNCA_NOSYSMENU | WTNCA_NOMIRRORHELP;
         let options = WinThemeAttribute { flag: flags, mask };
 
         SetWindowThemeAttribute(
             HWND(hwnd.0),
             WTA_NONCLIENT,
             ptr::addr_of!(options) as *const c_void,
-            size_of::<WinThemeAttribute>().try_into().unwrap()
+            size_of::<WinThemeAttribute>().try_into().unwrap(),
-        ).unwrap();
+        )
+        .unwrap();
     }
 }
 
@@ -78,12 +81,17 @@ pub fn setup_win_window<R: Runtime>(window: Window<R>) {
     let win_handle = window.hwnd().unwrap();
     let win_clone = win_handle.clone();
 
-    window.listen_global("yaak_bg_changed", move |ev| {
+    let event_id = window.listen("yaak_bg_changed", move |ev| {
-        let payload = serde_json::from_str::<&str>(ev.payload().unwrap())
+        let payload = serde_json::from_str::<&str>(ev.payload()).unwrap().trim();
-            .unwrap()
-            .trim();
-
         let color = HexColor::parse_rgb(payload).unwrap();
         update_bg_color(&HWND(win_clone.0), color);
     });
+
+    let h = window.app_handle().clone();
+    window.on_window_event(move |e| match e {
+        WindowEvent::Destroyed => {
+            h.unlisten(event_id);
+        }
+        _ => {}
+    })
 }

src-web/components/Settings/Settings.tsx

@@ -1,6 +1,8 @@
 import { getCurrent } from '@tauri-apps/api/webviewWindow';
+import classNames from 'classnames';
 import React from 'react';
 import { createGlobalState, useKeyPressEvent } from 'react-use';
+import { useOsInfo } from '../../hooks/useOsInfo';
 import { capitalize } from '../../lib/capitalize';
 import { HStack } from '../core/Stacks';
 import { TabContent, Tabs } from '../core/Tabs/Tabs';
@@ -18,6 +20,7 @@ const tabs = [Tab.General, Tab.Appearance];
 const useTabState = createGlobalState<string>(tabs[0]!);
 
 export const Settings = () => {
+  const osInfo = useOsInfo();
   const [tab, setTab] = useTabState();
 
   // Close settings window on escape
@@ -37,8 +40,10 @@ export const Settings = () => {
           justifyContent="center"
           className="w-full h-full grid grid-cols-[1fr_auto] pointer-events-none"
         >
-          <div className="text-center">Settings</div>
+          <div className={classNames(osInfo?.osType === 'macos' ? 'text-center' : 'pl-2')}>
-          <WindowControls className="ml-auto" />
+            Settings
+          </div>
+          <WindowControls className="ml-auto" onlyX />
         </HStack>
       </HeaderSize>
       <Tabs

src-web/components/WindowControls.tsx

@@ -7,9 +7,10 @@ import { HStack } from './core/Stacks';
 
 interface Props {
   className?: string;
+  onlyX?: boolean;
 }
 
-export function WindowControls({ className }: Props) {
+export function WindowControls({ className, onlyX }: Props) {
   const [maximized, setMaximized] = useState<boolean>(false);
   const osInfo = useOsInfo();
   const shouldShow = osInfo?.osType === 'linux' || osInfo?.osType === 'windows';
@@ -19,37 +20,41 @@ export function WindowControls({ className }: Props) {
 
   return (
     <HStack className={classNames(className, 'ml-4 h-full')}>
-      <Button
+      {!onlyX && (
-        className="!h-full px-4 text-fg-subtle hocus:text-fg hocus:bg-background-highlight-secondary rounded-none"
+        <>
-        color="custom"
+          <Button
-        onClick={() => getCurrent().minimize()}
+            className="!h-full px-4 text-fg-subtle hocus:text-fg hocus:bg-background-highlight-secondary rounded-none"
-      >
+            color="custom"
-        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+            onClick={() => getCurrent().minimize()}
-          <path fill="currentColor" d="M14 8v1H3V8z" />
+          >
-        </svg>
+            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-      </Button>
+              <path fill="currentColor" d="M14 8v1H3V8z" />
-      <Button
+            </svg>
-        className="!h-full px-4 text-fg-subtle hocus:text-fg hocus:bg-background-highlight rounded-none"
+          </Button>
-        color="custom"
+          <Button
-        onClick={async () => {
+            className="!h-full px-4 text-fg-subtle hocus:text-fg hocus:bg-background-highlight rounded-none"
-          const w = getCurrent();
+            color="custom"
-          await w.toggleMaximize();
+            onClick={async () => {
-          setMaximized(await w.isMaximized());
+              const w = getCurrent();
-        }}
+              await w.toggleMaximize();
-      >
+              setMaximized(await w.isMaximized());
-        {maximized ? (
+            }}
-          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+          >
-            <g fill="currentColor">
+            {maximized ? (
-              <path d="M3 5v9h9V5zm8 8H4V6h7z" />
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-              <path fillRule="evenodd" d="M5 5h1V4h7v7h-1v1h2V3H5z" clipRule="evenodd" />
+                <g fill="currentColor">
-            </g>
+                  <path d="M3 5v9h9V5zm8 8H4V6h7z" />
-          </svg>
+                  <path fillRule="evenodd" d="M5 5h1V4h7v7h-1v1h2V3H5z" clipRule="evenodd" />
-        ) : (
+                </g>
-          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+              </svg>
-            <path fill="currentColor" d="M3 3v10h10V3zm9 9H4V4h8z" />
+            ) : (
-          </svg>
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-        )}
+                <path fill="currentColor" d="M3 3v10h10V3zm9 9H4V4h8z" />
-      </Button>
+              </svg>
+            )}
+          </Button>
+        </>
+      )}
       <Button
         color="custom"
         className="!h-full px-4 text-fg-subtle rounded-none hocus:bg-fg-danger hocus:text-fg"