mirror/Plan
2
0
Fork 0
mirror of https://github.com/plan-player-analytics/Plan.git synced 2024-12-21 05:50:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

Insert html into nickname list on React version of player page

Browse Source 
Affects issues:
- Fixed #2329
This commit is contained in:
Aurora Lahtela 2022-05-21 09:33:03 +03:00
parent f36f1202fc
commit b52f257f3c
2 changed files with 43 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
Plan/react/dashboard/src/components/cards/player/NicknamesCard.js Normal file
View File

@ -0,0 +1,42 @@
import {useTranslation} from "react-i18next";
import {useTheme} from "../../../hooks/themeHook";
import {Card} from "react-bootstrap-v5";
import {FontAwesomeIcon as Fa} from "@fortawesome/react-fontawesome";
import {faServer, faSignature} from "@fortawesome/free-solid-svg-icons";
import Scrollable from "../../Scrollable";
import {faClock} from "@fortawesome/free-regular-svg-icons";
import React from "react";
const NicknamesCard = ({player}) => {
const {t} = useTranslation();
const {nightModeEnabled} = useTheme();
return (
<Card>
<Card.Header>
<h6 className="col-black">
<Fa icon={faSignature}/> {t('html.label.seenNicknames')}
</h6>
</Card.Header>
<Scrollable>
<table className={"table table-striped mb-0" + (nightModeEnabled ? " table-dark" : '')}>
<thead className="bg-purple">
<tr>
<th><Fa icon={faSignature}/> {t('html.label.nickname')}</th>
<th><Fa icon={faServer}/> {t('html.label.server')}</th>
<th><Fa icon={faClock}/> {t('html.label.lastSeen')}</th>
</tr>
</thead>
<tbody>
{player.nicknames.map((nickname, i) => (<tr key={'nick-' + i}>
<td dangerouslySetInnerHTML={{__html: nickname.nickname}}/>
<td>{nickname.server}</td>
<td>{nickname.date}</td>
</tr>))}
</tbody>
</table>
</Scrollable>
</Card>
);
}
export default NicknamesCard;

34
Plan/react/dashboard/src/views/PlayerOverview.js
View File

@ -12,7 +12,6 @@ import {
faLocationArrow,
faServer,
faSignal,
faSignature,
faSkull,
faUser,
faUserPlus,
@ -27,6 +26,7 @@ import {useTheme} from "../hooks/themeHook";
import {usePlayer} from "./PlayerPage";
import {useMetadata} from "../hooks/metadataHook";
import {useTranslation} from "react-i18next";
import NicknamesCard from "../components/cards/player/NicknamesCard";
const PlayerOverviewCard = ({player}) => {
const {t} = useTranslation();
@ -140,38 +140,6 @@ const PlayerOverviewCard = ({player}) => {
);
}
const NicknamesCard = ({player}) => {
const {t} = useTranslation();
const {nightModeEnabled} = useTheme();
return (
<Card>
<Card.Header>
<h6 className="col-black">
<Fa icon={faSignature}/> {t('html.label.seenNicknames')}
</h6>
</Card.Header>
<Scrollable>
<table className={"table table-striped mb-0" + (nightModeEnabled ? " table-dark" : '')}>
<thead className="bg-purple">
<tr>
<th><Fa icon={faSignature}/> {t('html.label.nickname')}</th>
<th><Fa icon={faServer}/> {t('html.label.server')}</th>
<th><Fa icon={faClock}/> {t('html.label.lastSeen')}</th>
</tr>
</thead>
<tbody>
{player.nicknames.map((nickname, i) => (<tr key={'nick-' + i}>
<td>{nickname.nickname}</td>
<td>{nickname.server}</td>
<td>{nickname.date}</td>
</tr>))}
</tbody>
</table>
</Scrollable>
</Card>
);
}
const ConnectionsCard = ({player}) => {
const {t} = useTranslation();
const {nightModeEnabled} = useTheme();