1- import React , { createContext , useContext , useEffect } from 'react' ;
1+ import React , { createContext , useContext , useEffect , useRef } from 'react' ;
22import usePersistentState from '../hooks/usePersistentState' ;
33import { useAchievements } from './AchievementContext' ;
44
@@ -10,6 +10,8 @@ export const useVisualSettings = () => {
1010
1111export const VisualSettingsProvider = ( { children } ) => {
1212 const { unlockAchievement } = useAchievements ( ) ;
13+ const themeChangeTimestamps = useRef ( [ ] ) ; // Track theme changes
14+
1315 const [ isInverted , setIsInverted ] = usePersistentState ( 'is-inverted' , false ) ;
1416 const [ isRetro , setIsRetro ] = usePersistentState ( 'is-retro' , false ) ;
1517 const [ isParty , setIsParty ] = usePersistentState ( 'is-party' , false ) ;
@@ -41,6 +43,42 @@ export const VisualSettingsProvider = ({ children }) => {
4143 const [ isAutumn , setIsAutumn ] = usePersistentState ( 'is-autumn' , false ) ;
4244 const [ isRain , setIsRain ] = usePersistentState ( 'is-rain' , false ) ;
4345
46+ // Chaos Theory Achievement Tracker
47+ useEffect ( ( ) => {
48+ const now = Date . now ( ) ;
49+ // Filter timestamps older than 10 seconds
50+ themeChangeTimestamps . current = themeChangeTimestamps . current . filter (
51+ ( t ) => now - t < 10000 ,
52+ ) ;
53+ // Add current timestamp
54+ themeChangeTimestamps . current . push ( now ) ;
55+
56+ // Check if 10 changes happened in 10 seconds
57+ if ( themeChangeTimestamps . current . length >= 10 ) {
58+ unlockAchievement ( 'chaos_theory' ) ;
59+ }
60+ } , [
61+ isInverted ,
62+ isRetro ,
63+ isParty ,
64+ isMirror ,
65+ isNoir ,
66+ isTerminal ,
67+ isBlueprint ,
68+ isSepia ,
69+ isVaporwave ,
70+ isCyberpunk ,
71+ isGameboy ,
72+ isComic ,
73+ isSketchbook ,
74+ isHellenic ,
75+ isGlitch ,
76+ isGarden ,
77+ isAutumn ,
78+ isRain ,
79+ unlockAchievement ,
80+ ] ) ;
81+
4482 useEffect ( ( ) => {
4583 if ( isInverted ) {
4684 document . body . classList . add ( 'invert-mode' ) ;
0 commit comments