Merge pull request #1062 from bilkee/feature/performance-and-versioning-updates

 Feat: Performance and Versioning Improvements

Author: RUKAYAT-CODER

.github/dependabot.yml

@@ -0,0 +1,18 @@
+import { ExpoConfig, ConfigContext } from '@expo/config';
+
+const packageJson = require('./package.json');
+
+export default ({ config }: ConfigContext): ExpoConfig => {
+  return {
+    ...config,
+    version: packageJson.version,
+    ios: {
+      ...config.ios,
+      buildNumber: String(packageJson.version.split('.')[2]),
+    },
+    android: {
+      ...config.android,
+      versionCode: Number(packageJson.version.replace(/\./g, '')),
+    },
+  };
+};

app.config.ts

@@ -173,11 +173,8 @@
     "yaml": "^2.9.0"
   },
   "overrides": {
-    "@tootallnate/once": "^3.0.1",
     "brace-expansion": "^1.1.13",
     "postcss": "^8.5.12",
-    "tmp": "^0.2.6",
-    "ws": "^8.21.0",
     "uuid": "^11.0.3"
   },
   "private": true,
@@ -211,4 +208,4 @@
   "optionalDependencies": {
     "lightningcss-linux-x64-gnu": "^1.32.0"
   }
-}
+}

app.json

@@ -10,6 +10,16 @@
     "dependencies"
   ],
   "packageRules": [
+    {
+      "matchUpdateTypes": ["patch"],
+      "groupName": "patch dependencies",
+      "groupSlug": "patch-dependencies"
+    },
+    {
+      "matchManagers": ["github-actions"],
+      "groupName": "GitHub Actions",
+      "groupSlug": "github-actions"
+    },
     {
       "matchUpdateTypes": ["patch"],
       "matchDepTypes": ["devDependencies"],
@@ -60,4 +70,4 @@
     "commitMessageTopic": "lock file maintenance",
     "commitMessageAction": "Update"
   }
-}
+}

package.json

@@ -66,6 +66,8 @@ const RARITY_LABELS: Record<BadgeRarity, string> = {
   legendary: 'Legendary',
 };
 
+import { VirtualList } from './VirtualList';
+
 const AchievementBadgesComponent: React.FC<AchievementBadgesProps> = ({
   achievements,
   isDark = false,
@@ -83,7 +85,7 @@ const AchievementBadgesComponent: React.FC<AchievementBadgesProps> = ({
     announceToScreenReader(`Opening details for ${achievement.name} badge.`);
   }, []);
 
-  const renderBadge = (achievement: Achievement) => {
+  const renderBadge = useCallback(({ item: achievement }: { item: Achievement }) => {
     const rarity = achievement.rarity ?? 'common';
     const gradColors = RARITY_COLORS[rarity];
     const isLocked = achievement.isLocked;
@@ -171,7 +173,7 @@ const AchievementBadgesComponent: React.FC<AchievementBadgesProps> = ({
         )}
       </TouchableOpacity>
     );
-  };
+  }, [isDark, handleSelectBadge]);
 
   return (
     <View style={[styles.container, { backgroundColor: isDark ? '#0f172a' : '#fff' }]}>
@@ -194,15 +196,20 @@ const AchievementBadgesComponent: React.FC<AchievementBadgesProps> = ({
       </View>
 
       {achievements.length > 0 ? (
-        <ScrollView
+        <VirtualList
+          data={achievements}
+          renderItem={renderBadge}
+          keyExtractor={item => item.id}
           horizontal
           showsHorizontalScrollIndicator={false}
           contentContainerStyle={styles.scrollContent}
           accessibilityLabel="Horizontal achievements list"
           removeClippedSubviews={true}
-        >
-          {achievements.map(renderBadge)}
-        </ScrollView>
+          initialNumToRender={5}
+          maxToRenderPerBatch={5}
+          windowSize={3}
+          itemSize={72}
+        />
       ) : (
         <View
           style={styles.emptyState}
@@ -536,4 +543,4 @@ const styles = StyleSheet.create({
     height: '100%',
     borderRadius: 3,
   },
-});
+});