Merge pull request #9 from Asiern/dev

v1.1.0

.gitignore

@@ -353,5 +353,3 @@ MigrationBackup/
 .ionide/
 
 Builds/
-*.lock
-Source/yarn.lock

Notes.md

@@ -1,3 +1,23 @@
+# Version 1.1.0 Notes
+
+## What's new?
+
+- Ads Removed
+
+## Fixes
+
+- Fixed: Asset images not displaying
+- Fixed: Category variable button not displaying label
+
+## Known issues
+
+- Japanese names not displaying.
+- OS forced darkmode breaks `UserHeader.js` colors.
+- Game without categories not loading.
+- App crashing
+
+---
+
 # Version 1.0.13 Notes
 
 ## What's new?

README.md

@@ -125,35 +125,23 @@ It allows you to consult the speedrun.com page natively on your Android/iOS devi
 
 ## :scroll: Release Notes
 
-### Version 1.0.13 | [View All Versions](Notes.md)
+### Version 1.1.0 | [View All Versions](Notes.md)
 
 #### What's new?
 
-- RunInfo
-- Expo SDK 40
-- Themes
-- Context
-- Notifications Settings
-- Show misc. categories
+- Ads Removed
 
 #### Fixes
 
-- Fixed: Login layout issues when using the keyboard.
-- Fixed: Leaderboard times format.
-- Fixed: App crashes when selecting a guest user profile/run.
-- Fixed: Settings layout.
-- Fixed: Webview interactions.
-
-#### Performance
-
-- App loading
-- App perfomance
+- Fixed: Asset images not displaying
+- Fixed: Category variable button not displaying label
 
 #### Known issues
 
 - Japanese names not displaying.
 - OS forced darkmode breaks `UserHeader.js` colors.
 - Game without categories not loading.
+- App crashing
 
 ## :page_with_curl: Privacy Policy / Terms & Conditions / License
 

Source/App.tsx

@@ -1,7 +1,8 @@
 import React, { useState, useEffect } from "react";
-import AsyncStorage from "@react-native-community/async-storage";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 import { ActivityIndicator } from "react-native";
 
+
 //Themes
 import { Theme } from "./app/themes/DefaultTheme";
 

Source/app.json

@@ -5,7 +5,7 @@
     "name": "SpeedrunHub",
     "slug": "speedruncomapp",
     "platforms": ["ios", "android"],
-    "version": "1.0.13",
+    "version": "1.1.0",
     "orientation": "portrait",
     "icon": "./app/assets/trophy.png",
 
@@ -25,7 +25,7 @@
     "githubUrl": "https://github.com/Asiern/SpeedrunHub",
     "android": {
       "package": "com.asiern.speedrun2",
-      "versionCode": 1,
+      "versionCode": 2,
       "permissions": [],
       "config": {
         "googleMobileAdsAppId": "ca-app-pub-3552758561036628~8801055846"

Source/app/components/GameCard.tsx

@@ -6,13 +6,15 @@ import { TouchableOpacity } from "react-native-gesture-handler";
 export interface GameCardProps {
   id: string;
   abbreviation: string;
+  image: string;
   width?: number;
   height?: number;
 }
 
 export default function GameCard({
   id,
   abbreviation,
+  image,
   width,
   height,
 }: GameCardProps) {
@@ -30,10 +32,7 @@ export default function GameCard({
       >
         <ImageBackground
           source={{
-            uri:
-              "https://www.speedrun.com/themes/" +
-              abbreviation +
-              "/cover-256.png",
+            uri: image,
           }}
           style={styles.image}
           imageStyle={{ borderRadius: 10 }}

Source/app/components/GameInfoComponents/GameHeader.tsx

@@ -8,12 +8,13 @@ import Constants from "expo-constants";
 import Feather from "@expo/vector-icons/Feather";
 import { colors, h2w } from "../../themes/theme";
 import { FontAwesome } from "@expo/vector-icons";
-import AsyncStorage from "@react-native-community/async-storage";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 import { context } from "../../config/config";
 
 export interface GameHeaderProps {
   abbreviation: string;
   name: string;
+  uri: string;
   date: string;
   platforms: any[];
   id: string;
@@ -22,6 +23,7 @@ export interface GameHeaderProps {
 const GameHeader = ({
   abbreviation,
   name,
+  uri,
   date,
   platforms,
   id,
@@ -30,6 +32,7 @@ const GameHeader = ({
   const navigation = useNavigation();
   const goBack = StackActions.pop();
   const { games, setGames } = useContext(context);
+
   const _isFavourite = async (id: string) => {
     for (let GAME of games) {
       if (GAME.id == id) {
@@ -41,6 +44,7 @@ const GameHeader = ({
     //Create game obj
     var game = {
       id: id,
+      uri: uri,
       abbreviation: abbreviation,
     };
     if (!isFav) {
@@ -83,8 +87,7 @@ const GameHeader = ({
       }}
       style={styles.profileBG}
       source={{
-        uri:
-          "https://www.speedrun.com/themes/" + abbreviation + "/cover-256.png",
+        uri: uri,
       }}
     >
       <View style={styles.topbar}>
@@ -121,6 +124,7 @@ const GameHeader = ({
       <View style={styles.profile}>
         <Carousel
           abbreviation={abbreviation}
+          uri={uri}
           date={date}
           platformIDs={platforms}
         />

Source/app/components/GameInfoComponents/GameInfoCarousel.tsx

@@ -1,6 +1,6 @@
 import React, { useContext } from "react";
 import { StyleSheet, View, Dimensions, Text, Image } from "react-native";
-import { colors, h4w } from "../../themes/theme";
+import { h4w } from "../../themes/theme";
 import Dot from "../Dot";
 import Animated, {
   useSharedValue,
@@ -11,11 +11,12 @@ import { context } from "../../config/config";
 
 export interface CarouselProps {
   abbreviation: string;
+  uri: string;
   date: string;
   platformIDs: any[];
 }
 
-export default function Carousel({ abbreviation, date }: CarouselProps) {
+export default function Carousel({ abbreviation, uri, date }: CarouselProps) {
   const { width } = Dimensions.get("window");
   const x = useSharedValue(0);
   const onScroll = useAnimatedScrollHandler({
@@ -42,10 +43,7 @@ export default function Carousel({ abbreviation, date }: CarouselProps) {
         <View style={[styles.imagecontainer, { width }]}>
           <Image
             source={{
-              uri:
-                "https://www.speedrun.com/themes/" +
-                abbreviation +
-                "/cover-256.png",
+              uri: uri,
             }}
             style={styles.Image}
           ></Image>

Source/app/components/GameInfoComponents/VariableButton.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Text, StyleSheet } from "react-native";
+import { Text, StyleSheet, TouchableOpacity } from "react-native";
 import { RectButton } from "react-native-gesture-handler";
 import { context } from "../../config/config";
 import { colors } from "../../themes/theme";
@@ -16,12 +16,12 @@ const Button = ({ label, variant, onPress }: ButtonProps) => {
   var backgroundColor =
     variant === "primary" ? theme.colors.primary : theme.colors.card;
   return (
-    <RectButton
+    <TouchableOpacity
       style={[styles.container, { backgroundColor }]}
       {...{ onPress }}
     >
       <Text style={[styles.label, { color }]}>{label}</Text>
-    </RectButton>
+    </TouchableOpacity>
   );
 };
 
@@ -39,11 +39,11 @@ const styles = StyleSheet.create({
     shadowOffset: { width: 5, height: 5 },
     shadowOpacity: 1,
     elevation: 1,
-    padding: 15,
   },
   label: {
     fontSize: 15,
     fontWeight: "bold",
+    padding: 10,
   },
 });
 export default Button;

Source/app/components/MyGames.tsx

@@ -20,6 +20,7 @@ export default function MyGames() {
               <GameCard
                 key={game.id}
                 id={game.id}
+                image={game.uri}
                 abbreviation={game.abbreviation}
               />
             );

Source/app/components/Profile/ProfileCarousel.tsx

@@ -11,10 +11,16 @@ import Animated, {
 export interface CarouselProps {
   username: string;
   signup: string;
+  image: string;
   country?: string;
 }
 
-export default function Carousel({ username, signup, country }: CarouselProps) {
+export default function Carousel({
+  username,
+  signup,
+  image,
+  country,
+}: CarouselProps) {
   const { width } = Dimensions.get("window");
   const x = useSharedValue(0);
   const onScroll = useAnimatedScrollHandler({
@@ -40,10 +46,7 @@ export default function Carousel({ username, signup, country }: CarouselProps) {
         <View style={[styles.imagecontainer, { width }]}>
           <Image
             source={{
-              uri:
-                "https://www.speedrun.com/themes/user/" +
-                username +
-                "/image.png",
+              uri: image,
             }}
             style={styles.Image}
           ></Image>

Source/app/components/Profile/ProfileHeader.tsx

@@ -9,21 +9,28 @@ export interface ProfileHeaderProps {
   username: string;
   country?: string;
   signup?: string;
+  image: string;
   onPress: () => void;
 }
 
 const ProfileHeader = ({
   username,
   country,
   signup,
+  image,
   onPress,
 }: ProfileHeaderProps) => {
   const { theme } = useContext(context);
   return (
     <View style={[styles.container, { backgroundColor: theme.colors.primary }]}>
       <TopBar variant={"transparent"} label={"Profile"} />
       <View style={styles.imagecontainer}>
-        <Carousel username={username} signup={signup} country={country} />
+        <Carousel
+          username={username}
+          signup={signup}
+          country={country}
+          image={image}
+        />
       </View>
       <View style={styles.userinfo}>
         <Text style={[h2w, { fontWeight: "bold" }]}>{username}</Text>

Source/app/components/Profile/helpers.ts

@@ -7,6 +7,7 @@ interface Section {
   data: SectionData[];
   id: string;
   name: string;
+  uri: string | null;
 }
 interface SectionData {
   key: string;
@@ -36,6 +37,14 @@ export interface user {
       };
     };
   };
+  assets: {
+    icon: {
+      uri: string | null;
+    };
+    image: {
+      uri: string | null;
+    };
+  };
   twitch: link | null;
   twitter: link | null;
   hitbox: link | null;

Source/app/components/Search/Games.tsx

@@ -38,7 +38,11 @@ export default function Games() {
         keyExtractor={(item) => item.id}
         data={games}
         renderItem={({ item }) => (
-          <GameCard id={item.id} abbreviation={item.abbreviation} />
+          <GameCard
+            id={item.id}
+            abbreviation={item.abbreviation}
+            image={item.assets["cover-medium"].uri}
+          />
         )}
       ></FlatList>
     </View>