Theme analytics and Moonlight

This commit is contained in:
Gregory Schier
2024-05-30 11:00:50 -07:00
parent 2caa735a2e
commit ba66883dc2
8 changed files with 100 additions and 15 deletions

View File

@@ -24,7 +24,7 @@ export const Settings = () => {
<>
<div
data-tauri-drag-region
className="h-[27px] bg-background-highlight-secondary flex items-center justify-center border-b border-background-highlight"
className="x-theme-appHeader h-[27px] bg-background text-fg-subtle flex items-center justify-center border-b border-background-highlight text-sm font-semibold"
>
Settings
</div>

View File

@@ -5,6 +5,7 @@ import { useResolvedTheme } from '../../hooks/useResolvedTheme';
import { useSettings } from '../../hooks/useSettings';
import { useThemes } from '../../hooks/useThemes';
import { useUpdateSettings } from '../../hooks/useUpdateSettings';
import { trackEvent } from '../../lib/analytics';
import { clamp } from '../../lib/clamp';
import { isThemeDark } from '../../lib/theme/window';
import type { ButtonProps } from '../core/Button';
@@ -112,6 +113,7 @@ export function SettingsAppearance() {
size="sm"
value={settings.appearance}
onChange={(appearance) => {
trackEvent('appearance', 'update', { appearance });
updateSettings.mutateAsync({ appearance });
}}
options={[
@@ -130,7 +132,10 @@ export function SettingsAppearance() {
size="sm"
value={activeTheme.light.id}
options={lightThemes}
onChange={(themeLight) => updateSettings.mutateAsync({ ...settings, themeLight })}
onChange={(themeLight) => {
trackEvent('theme', 'update', { theme: themeLight, appearance: 'light' });
updateSettings.mutateAsync({ ...settings, themeLight });
}}
/>
)}
{(settings.appearance === 'system' || settings.appearance === 'dark') && (
@@ -142,7 +147,10 @@ export function SettingsAppearance() {
size="sm"
value={activeTheme.dark.id}
options={darkThemes}
onChange={(themeDark) => updateSettings.mutateAsync({ ...settings, themeDark })}
onChange={(themeDark) => {
trackEvent('theme', 'update', { theme: themeDark, appearance: 'dark' });
updateSettings.mutateAsync({ ...settings, themeDark });
}}
/>
)}
</HStack>