Skip to content

Commit

Permalink
show family sharing indicator
Browse files Browse the repository at this point in the history
  • Loading branch information
@denniske
denniske committed Oct 31, 2024
1 parent 44ba147 commit c4ee20b
Show file tree
Hide file tree
Showing 5 changed files with 162 additions and 90 deletions.
17 changes: 17 additions & 0 deletions app/src/api/helper/api.types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -162,9 +162,25 @@ export interface IProfileResult {
country: string;
countryIcon: string;
verified: boolean;
shared: boolean;
leaderboards: IProfileLeaderboardResult[];
ratings: IProfileRatingsLeaderboard[];
stats: IStatNew[];
linkedProfiles: ILinkedProfile[];
}

interface ILinkedProfile {
profileId: number
steamId: any
name: string
country: any
games: number
drops: number
clan: any
avatarhash: any
hidden: any
verified: boolean
shared: boolean
}


Expand Down Expand Up @@ -315,6 +331,7 @@ export interface IPlayerNew {
won?: boolean
replay?: boolean
verified: boolean
shared?: boolean
}


Expand Down
10 changes: 9 additions & 1 deletion app/src/changelog.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -174,10 +174,18 @@ export const changelog4: IChangelog = {
};

export const changelog: IChangelog = {
'117.0.0': [
{
type: 'feature',
title: 'Steam Family Sharing Indicator',
content: 'Show family icon next to player in match popup and on profile',
},
],
'116.0.0': [
{
type: 'minor',
title: 'Check for update in play store / app store on startup and show a message if an update is available',
title: 'Check for update in play store / app store',
content: 'Check for update on startup and show a popup if an update is available',
},
],
'115.0.0': [
Expand Down
1 change: 1 addition & 0 deletions app/src/components/match/player.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,7 @@ export const MatchPlayer: React.FC<MatchPlayerProps> = ({ match, player, highlig
<TwitchBadge channel={twitch.user_login} condensed />
</View>
)}
{player.status === 0 && !isVerifiedPlayer(player.profileId) && player.shared && <Icon icon="family" color="brand" size={12} />}
</TouchableOpacity>
</Link>

Expand Down
219 changes: 132 additions & 87 deletions app/src/view/components/profile.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,13 @@
import { useTournamentPlayer } from '@app/api/tournaments';
import { Button } from '@app/components/button';
import { FontAwesome5 } from '@expo/vector-icons';
import { getDiscordInvitationId, getDoyouChannel, getTwitchChannel, getVerifiedPlayer, getYoutubeChannel } from '@nex/data';
import { FontAwesome5, FontAwesome6 } from '@expo/vector-icons';
import {
getDiscordInvitationId,
getDoyouChannel,
getTwitchChannel,
getVerifiedPlayer,
getYoutubeChannel,
} from '@nex/data';
import { Image, ImageStyle } from 'expo-image';
import React, { useEffect, useState } from 'react';
import { StyleSheet, TouchableOpacity, View } from 'react-native';
Expand All @@ -26,6 +32,9 @@ import { usePaperTheme } from '../../theming';
import { createStylesheet } from '../../theming-new';
import { TournamentPlayerPopup } from '../tournaments/player-popup';
import { TournamentMarkdown } from '../tournaments/tournament-markdown';
import { Icon } from '@app/components/icon';
import { FontAwesomeIconStyle } from '@fortawesome/react-native-fontawesome';
import { Link } from 'expo-router';

interface ILeaderboardRowProps {
data: IProfileLeaderboardResult;
Expand Down Expand Up @@ -185,19 +194,20 @@ export default function Profile({ data, ready }: IProfileProps) {
}
}, [data]);

// console.log('DATA===>', data);
// console.log('verifiedPlayer===>', verifiedPlayer);

return (
<View style={styles.container}>
<View>
<View className="space-y-3">
<View style={styles.row}>
{/*<ImageLoader style={styles.profileIcon} ready={data} source={{ uri: 'https://github.com/SiegeEngineers/aoc-reference-data/raw/master/data/photos/players/theviper.jpg'}}/>*/}
<View style={{ flex: 1 }}>
<View style={styles.row}>
<CountryImageLoader country={verifiedPlayer?.country || data?.country} ready={data} />

<TextLoader>{data?.name}</TextLoader>
{data?.verified && <FontAwesome5 solid name="check-circle" size={14} style={styles.verifiedIcon} />}
{data?.verified && <Icon icon="check-circle" color="brand" size={14} style={styles.verifiedIcon as FontAwesomeIconStyle} />}
{!data?.verified && data?.shared && <Icon icon="family" color="brand" size={14} style={styles.verifiedIcon as FontAwesomeIconStyle} />}
{!!data?.clan && (
<MyText>
{' '}
Expand Down Expand Up @@ -228,30 +238,31 @@ export default function Profile({ data, ready }: IProfileProps) {
</View>
</View>

<Space />

<View style={styles.row}>
{verifiedPlayer?.discord && (
<View style={styles.badge}>
<DiscordBadge serverId={verifiedPlayer?.discordServerId} invitationId={getDiscordInvitationId(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.youtube && (
<View style={styles.badge}>
<YoutubeBadge channel={getYoutubeChannel(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.douyu && (
<View style={styles.badge}>
<DouyuBadge channel={getDoyouChannel(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.twitch != null && (
<View style={styles.badge}>
<TwitchBadge channel={getTwitchChannel(verifiedPlayer)} />
</View>
)}
</View>
{
(verifiedPlayer?.discord || verifiedPlayer?.youtube || verifiedPlayer?.douyu || verifiedPlayer?.twitch != null) &&
<View style={styles.row}>
{verifiedPlayer?.discord && (
<View style={styles.badge}>
<DiscordBadge serverId={verifiedPlayer?.discordServerId} invitationId={getDiscordInvitationId(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.youtube && (
<View style={styles.badge}>
<YoutubeBadge channel={getYoutubeChannel(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.douyu && (
<View style={styles.badge}>
<DouyuBadge channel={getDoyouChannel(verifiedPlayer)} />
</View>
)}
{verifiedPlayer?.twitch != null && (
<View style={styles.badge}>
<TwitchBadge channel={getTwitchChannel(verifiedPlayer)} />
</View>
)}
</View>
}

{liquipediaProfile && (
<View className="justify-center">
Expand All @@ -270,67 +281,101 @@ export default function Profile({ data, ready }: IProfileProps) {
</View>
)}

<Space />
<View className="space-y-1">
<MyText>Linked</MyText>
{
data?.linkedProfiles?.map((data) => (
<Link key={data?.profileId} href={`/matches/users/${data?.profileId}?name=${data?.name}`} asChild>
<TouchableOpacity className="flex-1 flex-row gap-1 items-center">
<CountryImageLoader country={verifiedPlayer?.country || data?.country} ready={data} />

<TextLoader>{data?.name}</TextLoader>
{data?.verified && <Icon icon="check-circle" color="brand" size={14} style={styles.verifiedIcon as FontAwesomeIconStyle} />}
{!data?.verified && data?.shared && <Icon icon="family" color="brand" size={14} style={styles.verifiedIcon as FontAwesomeIconStyle} />}
{!!data?.clan && (
<MyText>
{' '}
({getTranslation('main.profile.clan')}: {data?.clan})
</MyText>
)}
</TouchableOpacity>
</Link>
))
}
</View>

<View style={styles.leaderboardRow}>
<MyText numberOfLines={1} style={styles.cellLeaderboard}>
{getTranslation('main.profile.heading.board')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRank}>
{getTranslation('main.profile.heading.rank')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRating}>
{getTranslation('main.profile.heading.rating')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRating2}>
{getTranslation('main.profile.heading.max')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRatingChange}>
{getTranslation('main.profile.heading.change')}
</MyText>
{
!data?.verified && data?.shared &&
<View className="flex-row items-center space-x-2">
<Icon icon="family" color="brand" size={14} />
<MyText>Steam Family Sharing</MyText>
</View>

}

<View>
<View style={styles.leaderboardRow}>
<MyText numberOfLines={1} style={styles.cellLeaderboard}>
{getTranslation('main.profile.heading.board')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRank}>
{getTranslation('main.profile.heading.rank')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRating}>
{getTranslation('main.profile.heading.rating')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRating2}>
{getTranslation('main.profile.heading.max')}
</MyText>
<MyText numberOfLines={1} style={styles.cellRatingChange}>
{getTranslation('main.profile.heading.change')}
</MyText>
</View>
{data?.leaderboards.map((leaderboard) => <LeaderboardRow1 key={leaderboard.leaderboardId} data={leaderboard} />)}

{!data &&
Array(2)
.fill(0)
.map((a, i) => (
<View key={i} style={styles.row}>
<TextLoader style={styles.cellLeaderboard} />
<TextLoader style={styles.cellRank} />
<TextLoader style={styles.cellRating} />
<TextLoader style={styles.cellRating2} />
<TextLoader style={styles.cellRatingChange} />
</View>
))}
</View>
{data?.leaderboards.map((leaderboard) => <LeaderboardRow1 key={leaderboard.leaderboardId} data={leaderboard} />)}

{!data &&
Array(2)
.fill(0)
.map((a, i) => (
<View key={i} style={styles.row}>
<TextLoader style={styles.cellLeaderboard} />
<TextLoader style={styles.cellRank} />
<TextLoader style={styles.cellRating} />
<TextLoader style={styles.cellRating2} />
<TextLoader style={styles.cellRatingChange} />
</View>
))}
<Space />
<View style={styles.leaderboardRow}>
<MyText numberOfLines={1} style={styles.cellLeaderboard}>
{getTranslation('main.profile.heading.board')}
</MyText>
<MyText numberOfLines={1} style={styles.cellGames}>
{getTranslation('main.profile.heading.games')}
</MyText>
<MyText numberOfLines={1} style={styles.cellWon}>
{getTranslation('main.profile.heading.won')}
</MyText>
<MyText numberOfLines={1} style={styles.cellStreak}>
{getTranslation('main.profile.heading.streak')}
</MyText>

<View>
<View style={styles.leaderboardRow}>
<MyText numberOfLines={1} style={styles.cellLeaderboard}>
{getTranslation('main.profile.heading.board')}
</MyText>
<MyText numberOfLines={1} style={styles.cellGames}>
{getTranslation('main.profile.heading.games')}
</MyText>
<MyText numberOfLines={1} style={styles.cellWon}>
{getTranslation('main.profile.heading.won')}
</MyText>
<MyText numberOfLines={1} style={styles.cellStreak}>
{getTranslation('main.profile.heading.streak')}
</MyText>
</View>
{data?.leaderboards.map((leaderboard) => <LeaderboardRow2 key={leaderboard.leaderboardId} data={leaderboard} />)}

{!data &&
Array(2)
.fill(0)
.map((a, i) => (
<View key={i} style={styles.row}>
<TextLoader style={styles.cellLeaderboard} />
<TextLoader style={styles.cellGames} />
<TextLoader style={styles.cellWon} />
<TextLoader style={styles.cellStreak} />
</View>
))}
</View>
{data?.leaderboards.map((leaderboard) => <LeaderboardRow2 key={leaderboard.leaderboardId} data={leaderboard} />)}

{!data &&
Array(2)
.fill(0)
.map((a, i) => (
<View key={i} style={styles.row}>
<TextLoader style={styles.cellLeaderboard} />
<TextLoader style={styles.cellGames} />
<TextLoader style={styles.cellWon} />
<TextLoader style={styles.cellStreak} />
</View>
))}
</View>
</View>
);
Expand Down
5 changes: 3 additions & 2 deletions data/src/helper/reference.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,8 +56,9 @@ export function isVerifiedPlayer(profileId: number) {
}

export function getVerifiedPlayer(profileId: number) {
// console.log(profileId, verifiedPlayer);
return aoeReferenceDataTyped.players?.find((p) => p.platforms?.rl?.includes(profileId.toString()));
// console.log(profileId);
// console.log(aoeReferenceDataTyped.players);
return aoeReferenceDataTyped.players?.find((p) => p.platforms?.rl?.some(rl => rl.includes(profileId.toString())));
}

export function getVerifiedPlayerBy(predicate: (value: IReferencePlayer, index: number) => unknown) {
Expand Down

0 comments on commit c4ee20b

Please sign in to comment.