react-achievements 2.1.1 → 2.2.1

package/src/defaultStyles.ts

@@ -1,14 +1,5 @@
 type StyleObject = { [key: string]: string | number };
 
-interface ModalStyles {
-    overlay: StyleObject;
-    content: StyleObject;
-    title: StyleObject;
-    icon: StyleObject;
-    description: StyleObject;
-    button: StyleObject;
-}
-
 interface BadgesModalStyles {
     overlay: StyleObject;
     content: StyleObject;
@@ -21,54 +12,11 @@ interface BadgesModalStyles {
 }
 
 export interface Styles {
-    achievementModal: ModalStyles;
     badgesModal: BadgesModalStyles;
     badgesButton: StyleObject;
 }
 
 export const defaultStyles: Styles = {
-    achievementModal: {
-        overlay: {
-            position: 'fixed',
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            backgroundColor: 'rgba(0, 0, 0, 0.5)',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-        },
-        content: {
-            backgroundColor: '#ffffff',
-            borderRadius: '8px',
-            padding: '20px',
-            maxWidth: '400px',
-            width: '100%',
-        },
-        title: {
-            fontSize: '24px',
-            fontWeight: 'bold',
-            marginBottom: '10px',
-        },
-        icon: {
-            width: '50px',
-            height: '50px',
-            marginBottom: '10px',
-        },
-        description: {
-            fontSize: '16px',
-            marginBottom: '20px',
-        },
-        button: {
-            backgroundColor: '#007bff',
-            color: '#ffffff',
-            padding: '10px 20px',
-            borderRadius: '4px',
-            border: 'none',
-            cursor: 'pointer',
-        },
-    },
     badgesModal: {
         overlay: {
             position: 'fixed',

package/src/hooks/useAchievement.ts

@@ -1,20 +1,17 @@
-import { useSelector, useDispatch } from 'react-redux';
-import { RootState, AppDispatch } from '../redux/store';
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
 import { useAchievementContext } from '../providers/AchievementProvider';
 
 export const useAchievement = () => {
-    const dispatch: AppDispatch = useDispatch();
-    const { updateMetrics, unlockedAchievements, resetStorage } = useAchievementContext() || {};
+    const { updateMetrics, unlockedAchievements, resetStorage } = useAchievementContext();
     const metrics = useSelector((state: RootState) => state.achievements.metrics);
-    const notifications = useSelector((state: RootState) => state.notifications.notifications);
     const config = useSelector((state: RootState) => state.achievements.config);
 
     return {
-        metrics: metrics,
-        unlockedAchievements: unlockedAchievements || [],
-        notifications: notifications,
-        config: config,
-        updateMetrics: updateMetrics || (() => {}),
-        resetStorage: resetStorage || (() => {}),
+        metrics,
+        unlockedAchievements,
+        config,
+        updateMetrics,
+        resetStorage,
     };
 };

package/src/index.ts

@@ -1,19 +1,25 @@
 import { AchievementProvider, useAchievementContext as useAchievement } from './providers/AchievementProvider';
-import { AchievementMetrics, AchievementConfiguration, AchievementDetails, AchievementUnlockCondition } from './types';
-import ConfettiWrapper from './components/ConfettiWrapper';
+import type { 
+    AchievementMetrics, 
+    AchievementConfiguration, 
+    AchievementDetails, 
+    AchievementUnlockCondition, 
+    AchievementMetricValue, 
+    InitialAchievementMetrics 
+} from './types';
 import achievementReducer from './redux/achievementSlice';
-import notificationReducer from './redux/notificationSlice'
-import { useAchievementState } from './hooks/useAchievementState';
 
 export {
     AchievementProvider,
     useAchievement,
+    achievementReducer,
+};
+
+export type {
     AchievementMetrics,
     AchievementConfiguration,
     AchievementDetails,
     AchievementUnlockCondition,
-    ConfettiWrapper,
-    achievementReducer,
-    notificationReducer,
-    useAchievementState,
+    AchievementMetricValue,
+    InitialAchievementMetrics,
 };

package/src/providers/AchievementProvider.tsx

@@ -1,19 +1,17 @@
-import React, { useEffect, useCallback, useState, useMemo } from 'react';
+import React, { useEffect, useCallback, useState, useMemo, useRef } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import { RootState, AppDispatch } from '../redux/store';
-import { initialize, setMetrics, unlockAchievement, resetAchievements, markAchievementAsAwarded } from '../redux/achievementSlice';
-import { addNotification, clearNotifications } from '../redux/notificationSlice';
+import { initialize, setMetrics, resetAchievements, unlockAchievement, clearNotifications } from '../redux/achievementSlice';
+import { toast, ToastContainer } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
 import {
     AchievementDetails,
     AchievementMetricValue,
-    SerializedAchievementUnlockCondition,
-    SerializedAchievementConfiguration,
+    AchievementConfiguration,
     AchievementProviderProps,
     AchievementMetrics,
-    AchievementConfiguration,
-    AchievementUnlockCondition,
+    AchievementState
 } from '../types';
-import AchievementModal from '../components/AchievementModal';
 import BadgesButton from '../components/BadgesButton';
 import BadgesModal from '../components/BadgesModal';
 import ConfettiWrapper from '../components/ConfettiWrapper';
@@ -35,6 +33,26 @@ export const useAchievementContext = () => {
     return context;
 };
 
+// Helper function to serialize dates for Redux actions
+const serializeMetrics = (metrics: AchievementMetrics): AchievementMetrics => {
+    return Object.entries(metrics).reduce((acc, [key, values]) => ({
+        ...acc,
+        [key]: values.map(value => value instanceof Date ? value.toISOString() : value)
+    }), {} as AchievementMetrics);
+};
+
+// Helper function to parse potential date strings
+const deserializeValue = (value: string | number | boolean): AchievementMetricValue => {
+    if (typeof value === 'string') {
+        // Try to parse ISO date string
+        const date = new Date(value);
+        if (!isNaN(date.getTime()) && value === date.toISOString()) {
+            return date;
+        }
+    }
+    return value;
+};
+
 const AchievementProvider: React.FC<AchievementProviderProps> = ({
     children,
     config,
@@ -45,171 +63,134 @@ const AchievementProvider: React.FC<AchievementProviderProps> = ({
     icons = {},
 }) => {
     const dispatch: AppDispatch = useDispatch();
+    const configRef = useRef(config);
     const metrics = useSelector((state: RootState) => state.achievements.metrics);
     const unlockedAchievementIds = useSelector((state: RootState) => state.achievements.unlockedAchievements);
-    const previouslyAwardedAchievements = useSelector((state: RootState) => state.achievements.previouslyAwardedAchievements);
-    const notifications = useSelector((state: RootState) => state.notifications.notifications);
-    const [currentAchievement, setCurrentAchievement] = useState<AchievementDetails | null>(null);
+    const pendingNotifications = useSelector((state: RootState) => state.achievements.pendingNotifications);
     const [showBadges, setShowBadges] = useState(false);
     const [showConfetti, setShowConfetti] = useState(false);
 
-    const serializeConfig = (config: AchievementConfiguration): SerializedAchievementConfiguration => {
-        const serializedConfig: SerializedAchievementConfiguration = {};
-        Object.entries(config).forEach(([metricName, conditions]) => {
-            serializedConfig[metricName] = (conditions as AchievementUnlockCondition<AchievementMetricValue>[]).map((condition: AchievementUnlockCondition<AchievementMetricValue>) => {
-                // Analyze the isConditionMet function to determine type and value
-                const funcString = condition.isConditionMet.toString();
-                let conditionType: 'number' | 'string' | 'boolean' | 'date';
-                let conditionValue: any;
-
-                if (funcString.includes('typeof value === "number"') || funcString.includes('typeof value === \'number\'')) {
-                    conditionType = 'number';
-                    const matches = funcString.match(/value\s*>=?\s*(\d+)/);
-                    conditionValue = matches ? parseInt(matches[1]) : 0;
-                } else if (funcString.includes('typeof value === "string"') || funcString.includes('typeof value === \'string\'')) {
-                    conditionType = 'string';
-                    const matches = funcString.match(/value\s*===?\s*['"](.+)['"]/);
-                    conditionValue = matches ? matches[1] : '';
-                } else if (funcString.includes('typeof value === "boolean"') || funcString.includes('typeof value === \'boolean\'')) {
-                    conditionType = 'boolean';
-                    conditionValue = funcString.includes('=== true');
-                } else if (funcString.includes('instanceof Date')) {
-                    conditionType = 'date';
-                    const matches = funcString.match(/new Date\(['"](.+)['"]\)/);
-                    conditionValue = matches ? matches[1] : new Date().toISOString();
-                } else {
-                    // Default to number type if we can't determine the type
-                    conditionType = 'number';
-                    conditionValue = 1;
-                }
-
-                return {
-                    achievementDetails: condition.achievementDetails,
-                    conditionType,
-                    conditionValue,
-                };
-            });
-        });
-        return serializedConfig;
-    };
-
-    const serializedConfig = useMemo(() => serializeConfig(config), [config]);
+    // Update config ref when it changes
+    useEffect(() => {
+        configRef.current = config;
+    }, [config]);
 
     const checkAchievements = useCallback(() => {
-        const newAchievements: AchievementDetails[] = [];
-        Object.entries(serializedConfig).forEach(([metricName, conditions]) => {
+        Object.entries(configRef.current).forEach(([metricName, conditions]) => {
             const metricValues = metrics[metricName];
             if (!metricValues) return;
+
+            const latestValue = deserializeValue(metricValues[metricValues.length - 1]);
+            const state: AchievementState = {
+                metrics: Object.entries(metrics).reduce((acc, [key, values]) => ({
+                    ...acc,
+                    [key]: values.map(deserializeValue)
+                }), {}),
+                unlockedAchievements: unlockedAchievementIds
+            };
+
             conditions.forEach((condition) => {
-                const isConditionMet = (value: AchievementMetricValue) => {
-                    switch (condition.conditionType) {
-                        case 'number':
-                            return typeof value === 'number' && value >= condition.conditionValue;
-                        case 'string':
-                            return typeof value === 'string' && value === condition.conditionValue;
-                        case 'boolean':
-                            return typeof value === 'boolean' && value === condition.conditionValue;
-                        case 'date':
-                            return value instanceof Date && 
-                                value.getTime() >= new Date(condition.conditionValue).getTime();
-                        default:
-                            return false;
-                    }
-                };
                 if (
-                    metricValues.some((value: AchievementMetricValue) => isConditionMet(value)) &&
-                    !unlockedAchievementIds.includes(condition.achievementDetails.achievementId) &&
-                    !previouslyAwardedAchievements.includes(condition.achievementDetails.achievementId)
+                    condition.isConditionMet(latestValue, state) &&
+                    !unlockedAchievementIds.includes(condition.achievementDetails.achievementId)
                 ) {
-                    newAchievements.push(condition.achievementDetails);
+                    dispatch(unlockAchievement(condition.achievementDetails));
+                    setShowConfetti(true);
                 }
             });
         });
-        if (newAchievements.length > 0) {
-            newAchievements.forEach((achievement) => {
-                dispatch(unlockAchievement(achievement.achievementId));
-                dispatch(markAchievementAsAwarded(achievement.achievementId));
-                dispatch(addNotification(achievement));
-            });
-            setShowConfetti(true);
-        }
-    }, [serializedConfig, metrics, unlockedAchievementIds, previouslyAwardedAchievements, dispatch]);
+    }, [metrics, unlockedAchievementIds, dispatch]);
 
+    // Handle notifications
     useEffect(() => {
-        checkAchievements();
-    }, [metrics, checkAchievements]);
+        if (pendingNotifications.length > 0) {
+            pendingNotifications.forEach((notification) => {
+                toast.success(
+                    <div>
+                        <h4 style={{ margin: '0 0 8px 0' }}>Achievement Unlocked! 🎉</h4>
+                        <strong>{notification.achievementTitle}</strong>
+                        <p style={{ margin: '4px 0 0 0' }}>{notification.achievementDescription}</p>
+                        {notification.achievementIconKey && icons[notification.achievementIconKey] && (
+                            <div style={{ fontSize: '24px', marginTop: '8px' }}>
+                                {icons[notification.achievementIconKey]}
+                            </div>
+                        )}
+                    </div>,
+                    {
+                        position: "top-right",
+                        autoClose: 5000,
+                        hideProgressBar: false,
+                        closeOnClick: true,
+                        pauseOnHover: true,
+                        draggable: true,
+                    }
+                );
+            });
+            dispatch(clearNotifications());
+        }
+    }, [pendingNotifications, dispatch, icons]);
 
+    // Reset confetti after delay
     useEffect(() => {
-        if (notifications.length > 0 && !currentAchievement) {
-            setCurrentAchievement(notifications[0]);
+        if (showConfetti) {
+            const timer = setTimeout(() => setShowConfetti(false), 5000);
+            return () => clearTimeout(timer);
         }
-    }, [notifications, currentAchievement]);
+    }, [showConfetti]);
 
-    const showBadgesModal = () => setShowBadges(true);
+    // Check for achievements when metrics change
+    useEffect(() => {
+        checkAchievements();
+    }, [metrics, checkAchievements]);
 
+    // Initialize on mount, but don't store config in Redux
     useEffect(() => {
         dispatch(initialize({
-            config: serializedConfig,
             initialState,
             storageKey,
         }));
-    }, [dispatch, serializedConfig, initialState, storageKey]);
+    }, [dispatch, initialState, storageKey]);
+
+    // Convert achievement IDs to details using config from ref
+    const achievementDetails = useMemo(() => {
+        return unlockedAchievementIds
+            .map(id => {
+                const achievement = Object.values(configRef.current)
+                    .flat()
+                    .find(condition => condition.achievementDetails.achievementId === id);
+                return achievement?.achievementDetails;
+            })
+            .filter((a): a is AchievementDetails => !!a);
+    }, [unlockedAchievementIds]);
 
     return (
-        <AchievementContext.Provider
-            value={{
-                updateMetrics: (newMetrics) => {
-                    if (typeof newMetrics === 'function') {
-                        const currentMetrics = metrics;
-                        const updatedMetrics = newMetrics(currentMetrics);
-                        dispatch(setMetrics(updatedMetrics));
-                    } else {
-                        dispatch(setMetrics(newMetrics));
-                    }
-                },
-                unlockedAchievements: unlockedAchievementIds,
-                resetStorage: () => {
-                    localStorage.removeItem(storageKey);
-                    dispatch(resetAchievements());
-                },
-            }}
-        >
+        <AchievementContext.Provider value={{
+            updateMetrics: (newMetrics) => {
+                if (typeof newMetrics === 'function') {
+                    const updatedMetrics = newMetrics(metrics);
+                    dispatch(setMetrics(serializeMetrics(updatedMetrics)));
+                } else {
+                    dispatch(setMetrics(serializeMetrics(newMetrics)));
+                }
+            },
+            unlockedAchievements: unlockedAchievementIds,
+            resetStorage: () => {
+                localStorage.removeItem(storageKey);
+                dispatch(resetAchievements());
+            },
+        }}>
             {children}
+            <ToastContainer />
             <ConfettiWrapper show={showConfetti} />
-            <AchievementModal
-                isOpen={!!currentAchievement}
-                achievement={currentAchievement}
-                onClose={() => {
-                    setCurrentAchievement(null);
-                    dispatch(clearNotifications());
-                    setShowConfetti(false);
-                }}
-                styles={styles.achievementModal || defaultStyles.achievementModal}
-                icons={icons}
-            />
             <BadgesButton
-                onClick={showBadgesModal}
+                onClick={() => setShowBadges(true)}
                 position={badgesButtonPosition}
                 styles={styles.badgesButton || defaultStyles.badgesButton}
-                unlockedAchievements={[...unlockedAchievementIds, ...previouslyAwardedAchievements]
-                    .filter((id, index, self) => self.indexOf(id) === index) // Remove duplicates
-                    .map(id => {
-                        const achievement = Object.values(serializedConfig)
-                            .flat()
-                            .find(condition => condition.achievementDetails.achievementId === id);
-                        return achievement?.achievementDetails;
-                    }).filter((a): a is AchievementDetails => !!a)}
+                unlockedAchievements={achievementDetails}
             />
             <BadgesModal
                 isOpen={showBadges}
-                achievements={[...unlockedAchievementIds, ...previouslyAwardedAchievements]
-                    .filter((id, index, self) => self.indexOf(id) === index) // Remove duplicates
-                    .map(id => {
-                        const achievement = Object.values(serializedConfig)
-                            .flat()
-                            .find(condition => condition.achievementDetails.achievementId === id);
-                        return achievement?.achievementDetails;
-                    }).filter((a): a is AchievementDetails => !!a)}
+                achievements={achievementDetails}
                 onClose={() => setShowBadges(false)}
                 styles={styles.badgesModal || defaultStyles.badgesModal}
                 icons={icons}

package/src/redux/achievementSlice.ts

@@ -1,91 +1,109 @@
 // src/redux/achievementSlice.ts
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import {
-    AchievementConfiguration,
     InitialAchievementMetrics,
     AchievementMetrics,
     AchievementDetails,
-    SerializedAchievementConfiguration,
+    AchievementMetricValue,
 } from '../types';
 
+// Helper function to serialize dates
+const serializeValue = (value: AchievementMetricValue): string | number | boolean => {
+    if (value instanceof Date) {
+        return value.toISOString();
+    }
+    return value;
+};
 
+// Helper function to process metrics for storage
+const processMetrics = (metrics: AchievementMetrics): Record<string, (string | number | boolean)[]> => {
+    return Object.entries(metrics).reduce((acc, [key, values]) => ({
+        ...acc,
+        [key]: values.map(serializeValue)
+    }), {});
+};
 
 export interface AchievementState {
-    config: SerializedAchievementConfiguration;
-    metrics: AchievementMetrics;
+    metrics: Record<string, (string | number | boolean)[]>;
     unlockedAchievements: string[];
-    previouslyAwardedAchievements: string[];
     storageKey: string | null;
+    pendingNotifications: AchievementDetails[];
 }
 
 const initialState: AchievementState = {
-    config: {},
     metrics: {},
     unlockedAchievements: [],
-    previouslyAwardedAchievements: [], // Initialize as empty
     storageKey: null,
+    pendingNotifications: [],
 };
 
 export const achievementSlice = createSlice({
     name: 'achievements',
     initialState,
     reducers: {
-        initialize: (state, action: PayloadAction<{ config: SerializedAchievementConfiguration; initialState?: InitialAchievementMetrics & { previouslyAwardedAchievements?: string[] }; storageKey: string }>) => {
-
-            state.config = action.payload.config;
+        initialize: (state, action: PayloadAction<{ 
+            initialState?: InitialAchievementMetrics & { unlockedAchievements?: string[] }; 
+            storageKey: string 
+        }>) => {
             state.storageKey = action.payload.storageKey;
-            const storedState = action.payload.storageKey ? localStorage.getItem(action.payload.storageKey) : null;
-
-            const initialMetrics = action.payload.initialState ? Object.keys(action.payload.initialState)
-                .filter(key => key !== 'previouslyAwardedAchievements')
-                .reduce((acc, key) => ({ ...acc, [key]: Array.isArray(action.payload.initialState![key]) ? action.payload.initialState![key] : [action.payload.initialState![key]] }), {}) : {};
 
-            const initialAwarded = action.payload.initialState?.previouslyAwardedAchievements || [];
-
-            if (storedState) {
-                try {
-                    const parsedState = JSON.parse(storedState);
-                    state.metrics = parsedState.achievements?.metrics || initialMetrics;
-                    state.unlockedAchievements = parsedState.achievements?.unlockedAchievements || [];
-                    state.previouslyAwardedAchievements = parsedState.achievements?.previouslyAwardedAchievements || initialAwarded; // Prioritize stored, fallback to initial
-                } catch (error) {
-                    console.error('Error parsing stored achievement state:', error);
-                    state.metrics = initialMetrics;
-                    state.unlockedAchievements = [];
-                    state.previouslyAwardedAchievements = initialAwarded;
+            // Load from storage first
+            if (action.payload.storageKey) {
+                const stored = localStorage.getItem(action.payload.storageKey);
+                if (stored) {
+                    try {
+                        const parsed = JSON.parse(stored);
+                        state.metrics = parsed.metrics || {};
+                        state.unlockedAchievements = parsed.unlockedAchievements || [];
+                        return;
+                    } catch (error) {
+                        console.error('Error parsing stored achievements:', error);
+                    }
                 }
-            } else {
-                state.metrics = initialMetrics;
-                state.unlockedAchievements = [];
-                state.previouslyAwardedAchievements = initialAwarded;
+            }
+
+            // If no storage or parse error, use initial state
+            if (action.payload.initialState) {
+                const { unlockedAchievements, ...metrics } = action.payload.initialState;
+                state.metrics = Object.entries(metrics).reduce((acc, [key, value]) => ({
+                    ...acc,
+                    [key]: Array.isArray(value) ? value.map(serializeValue) : [serializeValue(value as AchievementMetricValue)]
+                }), {});
+                state.unlockedAchievements = unlockedAchievements || [];
             }
         },
+
         setMetrics: (state, action: PayloadAction<AchievementMetrics>) => {
-            state.metrics = action.payload;
+            state.metrics = processMetrics(action.payload);
             if (state.storageKey) {
-                localStorage.setItem(state.storageKey, JSON.stringify({ achievements: { metrics: state.metrics, unlockedAchievements: state.unlockedAchievements, previouslyAwardedAchievements: state.previouslyAwardedAchievements } }));
+                localStorage.setItem(state.storageKey, JSON.stringify({
+                    metrics: state.metrics,
+                    unlockedAchievements: state.unlockedAchievements
+                }));
             }
         },
-        unlockAchievement: (state, action: PayloadAction<string>) => {
-            if (!state.unlockedAchievements.includes(action.payload)) {
-                state.unlockedAchievements.push(action.payload);
+
+        unlockAchievement: (state, action: PayloadAction<AchievementDetails>) => {
+            if (!state.unlockedAchievements.includes(action.payload.achievementId)) {
+                state.unlockedAchievements.push(action.payload.achievementId);
+                state.pendingNotifications.push(action.payload);
                 if (state.storageKey) {
-                    localStorage.setItem(state.storageKey, JSON.stringify({ achievements: { metrics: state.metrics, unlockedAchievements: state.unlockedAchievements, previouslyAwardedAchievements: state.previouslyAwardedAchievements } }));
+                    localStorage.setItem(state.storageKey, JSON.stringify({
+                        metrics: state.metrics,
+                        unlockedAchievements: state.unlockedAchievements
+                    }));
                 }
             }
         },
-        markAchievementAsAwarded: (state, action: PayloadAction<string>) => {
-            if (!state.previouslyAwardedAchievements.includes(action.payload)) {
-                state.previouslyAwardedAchievements.push(action.payload);
-                if (state.storageKey) {
-                    localStorage.setItem(state.storageKey, JSON.stringify({ achievements: { metrics: state.metrics, unlockedAchievements: state.unlockedAchievements, previouslyAwardedAchievements: state.previouslyAwardedAchievements } }));
-                }
-            }
+
+        clearNotifications: (state) => {
+            state.pendingNotifications = [];
         },
+
         resetAchievements: (state) => {
             state.metrics = {};
             state.unlockedAchievements = [];
-            state.previouslyAwardedAchievements = [];
+            state.pendingNotifications = [];
             if (state.storageKey) {
                 localStorage.removeItem(state.storageKey);
             }
@@ -93,6 +111,6 @@ export const achievementSlice = createSlice({
     },
 });
 
-export const { initialize, setMetrics, unlockAchievement, resetAchievements, markAchievementAsAwarded } = achievementSlice.actions;
+export const { initialize, setMetrics, resetAchievements, unlockAchievement, clearNotifications } = achievementSlice.actions;
 
 export default achievementSlice.reducer;

package/src/redux/notificationSlice.ts

@@ -1,19 +1,18 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
-import { AchievementDetails } from '../types';
 
-export interface NotificationState {
-    notifications: AchievementDetails[];
+interface NotificationState {
+    notifications: string[];
 }
 
 const initialState: NotificationState = {
     notifications: [],
 };
 
-const notificationSlice = createSlice({
+export const notificationSlice = createSlice({
     name: 'notifications',
     initialState,
     reducers: {
-        addNotification: (state, action: PayloadAction<AchievementDetails>) => {
+        addNotification: (state, action: PayloadAction<string>) => {
             state.notifications.push(action.payload);
         },
         clearNotifications: (state) => {
@@ -23,4 +22,5 @@ const notificationSlice = createSlice({
 });
 
 export const { addNotification, clearNotifications } = notificationSlice.actions;
+
 export default notificationSlice.reducer;

package/src/redux/store.ts

@@ -1,18 +1,14 @@
 import { configureStore } from '@reduxjs/toolkit';
-import achievementReducer from '../redux/achievementSlice';
-import notificationReducer from '../redux/notificationSlice';
+import achievementReducer from './achievementSlice';
 import { AchievementState } from './achievementSlice';
-import { NotificationState } from './notificationSlice';
 
 export interface RootState {
     achievements: AchievementState;
-    notifications: NotificationState;
 }
 
 const store = configureStore({
     reducer: {
         achievements: achievementReducer,
-        notifications: notificationReducer,
     },
 });