react-achievements 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/context/AchievementContext.d.ts +1 -0
  2. package/dist/index.cjs.js +8 -3
  3. package/dist/index.esm.js +8 -3
  4. package/package.json +2 -2
  5. package/src/components/Achievement.tsx +9 -2
  6. package/src/context/AchievementContext.tsx +2 -1
package/dist/context/AchievementContext.d.ts CHANGED
@@ -6,6 +6,7 @@ interface AchievementContextProps {
6
6
  setMetric: (value: number) => void;
7
7
  badges: BadgeConfig[];
8
8
  levels: LevelConfig[];
9
+ achievedLevels: number[];
9
10
  }
10
11
  declare const AchievementProvider: React.FC<{
11
12
  children: ReactNode;
package/dist/index.cjs.js CHANGED
@@ -140,7 +140,7 @@ const AchievementProvider = ({ children }) => {
140
140
  const [metric, setMetric] = React.useState(0);
141
141
  const [achievedLevels, setAchievedLevels] = React.useState([]);
142
142
  const [showConfetti, setShowConfetti] = React.useState(false);
143
- return (React.createElement(AchievementContext.Provider, { value: { metric, setMetric, badges: defaultBadges, levels } },
143
+ return (React.createElement(AchievementContext.Provider, { value: { metric, setMetric, badges: defaultBadges, levels, achievedLevels } },
144
144
  children,
145
145
  levels.map(levelConfig => {
146
146
  var _a, _b, _c;
@@ -157,11 +157,16 @@ const useAchievement = () => {
157
157
  };
158
158
 
159
159
  const Achievement = ({ metric, threshold, onAchieve, children }) => {
160
+ const { setMetric, achievedLevels, levels } = useAchievement();
160
161
  React.useEffect(() => {
161
- if (metric >= threshold) {
162
+ if (metric >= threshold && !achievedLevels.includes(threshold)) {
162
163
  onAchieve();
164
+ const levelConfig = levels.find(level => level.threshold === threshold);
165
+ if (levelConfig) {
166
+ setMetric(metric); // Update the metric in the context
167
+ }
163
168
  }
164
- }, [metric, threshold, onAchieve]);
169
+ }, [metric, threshold, onAchieve, setMetric, achievedLevels, levels]);
165
170
  return React.createElement("div", null, children);
166
171
  };
167
172
 
package/dist/index.esm.js CHANGED
@@ -138,7 +138,7 @@ const AchievementProvider = ({ children }) => {
138
138
  const [metric, setMetric] = useState(0);
139
139
  const [achievedLevels, setAchievedLevels] = useState([]);
140
140
  const [showConfetti, setShowConfetti] = useState(false);
141
- return (React.createElement(AchievementContext.Provider, { value: { metric, setMetric, badges: defaultBadges, levels } },
141
+ return (React.createElement(AchievementContext.Provider, { value: { metric, setMetric, badges: defaultBadges, levels, achievedLevels } },
142
142
  children,
143
143
  levels.map(levelConfig => {
144
144
  var _a, _b, _c;
@@ -155,11 +155,16 @@ const useAchievement = () => {
155
155
  };
156
156
 
157
157
  const Achievement = ({ metric, threshold, onAchieve, children }) => {
158
+ const { setMetric, achievedLevels, levels } = useAchievement();
158
159
  React.useEffect(() => {
159
- if (metric >= threshold) {
160
+ if (metric >= threshold && !achievedLevels.includes(threshold)) {
160
161
  onAchieve();
162
+ const levelConfig = levels.find(level => level.threshold === threshold);
163
+ if (levelConfig) {
164
+ setMetric(metric); // Update the metric in the context
165
+ }
161
166
  }
162
- }, [metric, threshold, onAchieve]);
167
+ }, [metric, threshold, onAchieve, setMetric, achievedLevels, levels]);
163
168
  return React.createElement("div", null, children);
164
169
  };
165
170
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-achievements",
3
- "version": "1.0.0",
4
- "description": "This package allows users to transpose a React game engine over their React apps",
3
+ "version": "1.0.1",
4
+ "description": "This package allows users to transpose a React achievements engine over their React apps",
5
5
  "keywords": [
6
6
  "react",
7
7
  "badge",
package/src/components/Achievement.tsx CHANGED
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { useAchievement } from '../context/AchievementContext';
2
3
 
3
4
  interface AchievementProps {
4
5
  metric: number;
@@ -8,11 +9,17 @@ interface AchievementProps {
8
9
  }
9
10
 
10
11
  const Achievement: React.FC<AchievementProps> = ({ metric, threshold, onAchieve, children }) => {
12
+ const { setMetric, achievedLevels, levels } = useAchievement();
13
+
11
14
  React.useEffect(() => {
12
- if (metric >= threshold) {
15
+ if (metric >= threshold && !achievedLevels.includes(threshold)) {
13
16
  onAchieve();
17
+ const levelConfig = levels.find(level => level.threshold === threshold);
18
+ if (levelConfig) {
19
+ setMetric(metric); // Update the metric in the context
20
+ }
14
21
  }
15
- }, [metric, threshold, onAchieve]);
22
+ }, [metric, threshold, onAchieve, setMetric, achievedLevels, levels]);
16
23
 
17
24
  return <div>{children}</div>;
18
25
  };
package/src/context/AchievementContext.tsx CHANGED
@@ -9,6 +9,7 @@ interface AchievementContextProps {
9
9
  setMetric: (value: number) => void;
10
10
  badges: BadgeConfig[];
11
11
  levels: LevelConfig[];
12
+ achievedLevels: number[];
12
13
  }
13
14
 
14
15
  const AchievementContext = createContext<AchievementContextProps | undefined>(undefined);
@@ -27,7 +28,7 @@ const AchievementProvider: React.FC<{ children: ReactNode }> = ({ children }) =>
27
28
  };
28
29
 
29
30
  return (
30
- <AchievementContext.Provider value={{ metric, setMetric, badges: defaultBadges, levels }}>
31
+ <AchievementContext.Provider value={{ metric, setMetric, badges: defaultBadges, levels, achievedLevels }}>
31
32
  {children}
32
33
  {levels.map(levelConfig =>
33
34
  achievedLevels.includes(levelConfig.level) ? (