aly/servatrice
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Show country flag in user list of webclient (#4431)

Browse source
This commit is contained in:
Bruno Mendes 2021-10-14 21:59:06 -03:00 committed by GitHub
parent 3bc90003b3
commit dde0f568d9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
webclient/src/components/UserDisplay/UserDisplay.css
View file

@ -8,4 +8,9 @@
height: 100%; height: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.user-display__country {
width: 1.1em;
margin-right: 0.4em;
}

5
webclient/src/components/UserDisplay/UserDisplay.tsx
View file

@ -6,6 +6,7 @@ import { NavLink, generatePath } from "react-router-dom";
import Menu from "@material-ui/core/Menu"; import Menu from "@material-ui/core/Menu";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@material-ui/core/MenuItem";
import { Images } from "images/Images";
import { SessionService } from "api"; import { SessionService } from "api";
import { ServerSelectors } from "store"; import { ServerSelectors } from "store";
import { RouteEnum, User } from "types"; import { RouteEnum, User } from "types";
@ -85,7 +86,7 @@ class UserDisplay extends Component<UserDisplayProps, UserDisplayState> {
render() { render() {
const { user } = this.props; const { user } = this.props;
const { position } = this.state; const { position } = this.state;
const { name } = user; const { name, country } = user;
const isABuddy = this.isABuddy(); const isABuddy = this.isABuddy();
const isIgnored = this.isIgnored(); const isIgnored = this.isIgnored();
@ -96,7 +97,7 @@ class UserDisplay extends Component<UserDisplayProps, UserDisplayState> {
<div className="user-display"> <div className="user-display">
<NavLink to={generatePath(RouteEnum.PLAYER, { name })} className="plain-link"> <NavLink to={generatePath(RouteEnum.PLAYER, { name })} className="plain-link">
<div className="user-display__details" onContextMenu={this.handleClick}> <div className="user-display__details" onContextMenu={this.handleClick}>
<div className="user-display__country"></div> <img className="user-display__country" src={Images.Countries[country]} alt={country}></img>
<div className="user-display__name single-line-ellipsis">{name}</div> <div className="user-display__name single-line-ellipsis">{name}</div>
</div> </div>
</NavLink> </NavLink>

6
webclient/src/images/Images.tsx
View file

@ -1,7 +1,7 @@
import Countries from "./countries/_Countries"; import Countries from "./countries/_Countries";
export class Images { export class Images {
static Countries = [ static Countries = {
...Countries ...Countries
]; };
} }

6
webclient/src/images/countries/_Countries.tsx
View file

@ -247,7 +247,7 @@ import za from "./za.svg";
import zm from "./zm.svg"; import zm from "./zm.svg";
import zw from "./zw.svg"; import zw from "./zw.svg";
const Countries = [ const Countries = {
ad, ad,
ae, ae,
af, af,
@ -496,6 +496,6 @@ const Countries = [
za, za,
zm, zm,
zw, zw,
]; };
export default Countries; export default Countries;