chore: check support blur on FE

This commit is contained in:
Faisal Amir 2025-10-06 10:38:17 +07:00
parent 39b1ba4691
commit 17dced03c0
8 changed files with 88 additions and 111 deletions

View File

@ -118,91 +118,3 @@ pub fn is_library_available(library: &str) -> bool {
}
}
// Check if the system supports blur/acrylic effects
// - Windows: Checks build version from OS info (17134+ for acrylic support)
// - Linux: Checks for KWin (KDE) or compositor with blur support via environment variables
// - macOS: Always supported
#[tauri::command]
pub fn supports_blur_effects() -> bool {
#[cfg(target_os = "windows")]
{
// Windows 10 build 17134 (1803) and later support acrylic effects
// Windows 11 (build 22000+) has better support
#[cfg(feature = "hardware")]
{
use tauri_plugin_hardware::get_system_info;
let system_info = get_system_info();
// os_name format: "Windows 10 Pro (build 22631)"
if let Some(build_str) = system_info.os_name.split("build ").nth(1) {
if let Some(build_num) = build_str.split(')').next() {
if let Ok(build) = build_num.trim().parse::<u32>() {
let supports_blur = build >= 17134;
if supports_blur {
log::info!("✅ Windows build {} detected - Blur/Acrylic effects SUPPORTED", build);
} else {
log::warn!("❌ Windows build {} detected - Blur/Acrylic effects NOT SUPPORTED (requires build 17134+)", build);
}
return supports_blur;
}
}
}
}
// Fallback: If hardware feature is disabled or parsing fails, assume modern Windows
log::info!("✅ Windows detected - Assuming modern build with blur support");
true
}
#[cfg(target_os = "linux")]
{
// Check desktop environment via environment variables
let desktop = std::env::var("XDG_CURRENT_DESKTOP").unwrap_or_default().to_lowercase();
let session = std::env::var("XDG_SESSION_DESKTOP").unwrap_or_default().to_lowercase();
// KDE Plasma with KWin (best blur support)
if desktop.contains("kde") || session.contains("kde") || session.contains("plasma") {
log::info!("✅ KDE/KWin detected - Blur effects SUPPORTED");
return true;
}
// GNOME with blur extensions (conditional support)
if desktop.contains("gnome") || session.contains("gnome") {
log::info!("🔍 GNOME detected - Blur support depends on extensions");
return true;
}
// Check for compositor via environment variable
if let Ok(compositor) = std::env::var("COMPOSITOR") {
let comp_lower = compositor.to_lowercase();
if comp_lower.contains("kwin") || comp_lower.contains("picom") || comp_lower.contains("compiz") {
log::info!("✅ Compositor detected: {} - Blur effects SUPPORTED", compositor);
return true;
}
}
// Check wayland/X11 session type (Wayland typically has better compositor support)
if let Ok(session_type) = std::env::var("XDG_SESSION_TYPE") {
if session_type == "wayland" {
log::info!("🔍 Wayland session detected - Likely blur support available");
return true;
}
}
log::warn!("❌ No known blur-capable compositor detected on Linux");
false
}
#[cfg(target_os = "macos")]
{
// macOS always supports blur/vibrancy effects
log::info!("✅ macOS detected - Blur/Vibrancy effects SUPPORTED");
true
}
#[cfg(not(any(target_os = "windows", target_os = "linux", target_os = "macos")))]
{
log::warn!("❌ Unknown platform - Assuming NO blur support");
false
}
}

View File

@ -78,7 +78,6 @@ pub fn run() {
core::system::commands::factory_reset,
core::system::commands::read_logs,
core::system::commands::is_library_available,
core::system::commands::supports_blur_effects,
// Server commands
core::server::commands::start_server,
core::server::commands::stop_server,

View File

@ -6,6 +6,7 @@ import { rgb, oklch, formatCss } from 'culori'
import { useTheme } from './useTheme'
import { useEffect, useState } from 'react'
import { getServiceHub } from '@/hooks/useServiceHub'
import { supportsBlurEffects } from '@/utils/blurSupport'
export type FontSize = '14px' | '15px' | '16px' | '18px'
export type ChatWidth = 'full' | 'compact'
@ -114,7 +115,8 @@ export const isDefaultColor = (color: RgbaColor): boolean => {
const isLightDefault = color.r === 255 && color.g === 255 && color.b === 255
// Consider it default if RGB matches and alpha is either 0.4 or 1 (common values)
const hasDefaultAlpha = Math.abs(color.a - 0.4) < 0.01 || Math.abs(color.a - 1) < 0.01
const hasDefaultAlpha =
Math.abs(color.a - 0.4) < 0.01 || Math.abs(color.a - 1) < 0.01
return (isDarkDefault || isLightDefault) && hasDefaultAlpha
}
@ -162,22 +164,36 @@ export const useBlurSupport = () => {
const checkBlurSupport = async () => {
if ((IS_WINDOWS || IS_LINUX) && IS_TAURI) {
try {
const supported = await getServiceHub().app().supportsBlurEffects()
// Get hardware info to check OS version
const hardwareInfo = await getServiceHub()
.hardware()
.getHardwareInfo()
const supported = supportsBlurEffects(hardwareInfo)
blurEffectsSupported = supported
setSupportsBlur(supported)
const platform = IS_WINDOWS ? 'Windows' : 'Linux'
if (supported) {
console.log(`${platform} blur effects: SUPPORTED - Alpha slider will be shown`)
console.log(
`${platform} blur effects: SUPPORTED - Alpha slider will be shown`
)
} else {
console.log(`${platform} blur effects: NOT SUPPORTED - Alpha slider will be hidden, alpha set to 1`)
console.log(
`${platform} blur effects: NOT SUPPORTED - Alpha slider will be hidden, alpha set to 1`
)
}
} catch (error) {
console.error(`❌ Failed to check ${IS_WINDOWS ? 'Windows' : 'Linux'} blur support:`, error)
console.error(
`❌ Failed to check ${IS_WINDOWS ? 'Windows' : 'Linux'} blur support:`,
error
)
setSupportsBlur(false)
}
} else if (IS_MACOS && IS_TAURI) {
console.log('🍎 macOS platform: Blur effects supported, alpha slider shown')
console.log(
'🍎 macOS platform: Blur effects supported, alpha slider shown'
)
} else if (!IS_TAURI) {
console.log('🌐 Web platform: Alpha slider hidden, alpha set to 1')
}
@ -362,7 +378,7 @@ export const useAppearance = create<AppearanceState>()(
}
// Force alpha to 1 if blur effects are not supported
if (!blurEffectsSupported && ((IS_WINDOWS || IS_LINUX) || !IS_TAURI)) {
if (!blurEffectsSupported && (IS_WINDOWS || IS_LINUX || !IS_TAURI)) {
finalColor = { ...finalColor, a: 1 }
}

View File

@ -39,9 +39,4 @@ export class DefaultAppService implements AppService {
console.log('readYaml called with path:', path)
throw new Error('readYaml not implemented in default app service')
}
async supportsBlurEffects(): Promise<boolean> {
// On web/non-Windows platforms, always return false
return false
}
}

View File

@ -75,8 +75,4 @@ export class TauriAppService extends DefaultAppService {
async readYaml<T = unknown>(path: string): Promise<T> {
return await invoke<T>('read_yaml', { path })
}
async supportsBlurEffects(): Promise<boolean> {
return await invoke<boolean>('supports_blur_effects')
}
}

View File

@ -17,5 +17,4 @@ export interface AppService {
relocateJanDataFolder(path: string): Promise<void>
getServerStatus(): Promise<boolean>
readYaml<T = unknown>(path: string): Promise<T>
supportsBlurEffects(): Promise<boolean>
}

View File

@ -45,9 +45,4 @@ export class WebAppService implements AppService {
console.log('YAML reading not available in web mode')
throw new Error('readYaml not implemented in web app service')
}
async supportsBlurEffects(): Promise<boolean> {
// Web platforms don't support blur effects
return false
}
}

View File

@ -0,0 +1,65 @@
/**
* Utility to check if the system supports blur/acrylic effects
* based on OS information from hardware data
*/
import type { HardwareData } from '@/hooks/useHardware'
/**
* Check if Windows supports blur effects based on build number
* Windows 10 build 17134 (version 1803) and later support acrylic effects
*/
function checkWindowsBlurSupport(osName: string): boolean {
// os_name format: "Windows 10 Pro (build 22631)" or similar
const buildMatch = osName.match(/build\s+(\d+)/i)
if (buildMatch && buildMatch[1]) {
const build = parseInt(buildMatch[1], 10)
return build >= 17134
}
// If we can't detect build number, assume modern Windows supports blur
return true
}
/**
* Check if Linux supports blur effects based on desktop environment
*/
function checkLinuxBlurSupport(): boolean {
// Check environment variables (only available in Tauri)
if (typeof window === 'undefined') return false
// These checks would need to be done on the backend
// For now, we'll assume Linux with common DEs supports blur
return true
}
/**
* Check if the system supports blur/acrylic effects
*
* @param hardwareData - Hardware data from the hardware plugin
* @returns true if blur effects are supported
*/
export function supportsBlurEffects(hardwareData: HardwareData | null): boolean {
if (!hardwareData) return false
const { os_type, os_name } = hardwareData
// macOS always supports blur/vibrancy effects
if (os_type === 'macos') {
return true
}
// Windows: Check build number
if (os_type === 'windows') {
return checkWindowsBlurSupport(os_name)
}
// Linux: Check desktop environment (simplified for now)
if (os_type === 'linux') {
return checkLinuxBlurSupport()
}
// Unknown platforms: assume no blur support
return false
}