remove mode
This commit is contained in:
parent
230b5ce7f7
commit
3099fdba7d
|
@ -1,5 +1,4 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useQueryParams, StringParam, withDefault } from 'use-query-params';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import useTitle from '@libs/useTitle';
|
import useTitle from '@libs/useTitle';
|
||||||
import useServer from '@features/ServerPage/libs/ServerContext/useServer';
|
import useServer from '@features/ServerPage/libs/ServerContext/useServer';
|
||||||
|
@ -7,50 +6,18 @@ import { SERVER_PAGE } from '@config/namespaces';
|
||||||
|
|
||||||
import { Container, Paper } from '@material-ui/core';
|
import { Container, Paper } from '@material-ui/core';
|
||||||
import Content from '@common/Content/Content';
|
import Content from '@common/Content/Content';
|
||||||
import ModeSelector from '@common/ModeSelector/ModeSelector';
|
|
||||||
import LiveEnnoblements from './components/LiveEnnoblements/LiveEnnoblements';
|
|
||||||
import LatestSavedEnnoblements from './components/LatestSavedEnnoblements/LatestSavedEnnoblements';
|
import LatestSavedEnnoblements from './components/LatestSavedEnnoblements/LatestSavedEnnoblements';
|
||||||
|
|
||||||
function EnnoblementsPage() {
|
function EnnoblementsPage() {
|
||||||
const [query, setQuery] = useQueryParams({
|
|
||||||
mode: withDefault(StringParam, 'live'),
|
|
||||||
});
|
|
||||||
const { key } = useServer();
|
const { key } = useServer();
|
||||||
const { t } = useTranslation(SERVER_PAGE.ENNOBLEMENTS_PAGE);
|
const { t } = useTranslation(SERVER_PAGE.ENNOBLEMENTS_PAGE);
|
||||||
useTitle(
|
useTitle(t('title', { key }));
|
||||||
t('title_' + (query.mode === 'latest' ? 'latest' : 'live'), { key })
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Content component="div" minHeight={false}>
|
<Content component="div" minHeight={false}>
|
||||||
<Container>
|
<Container>
|
||||||
<Paper>
|
<Paper>
|
||||||
<ModeSelector
|
|
||||||
onSelect={m => setQuery({ mode: m.name })}
|
|
||||||
buttonProps={{ size: 'medium' }}
|
|
||||||
modes={[
|
|
||||||
{
|
|
||||||
name: 'live',
|
|
||||||
label: t('modes.live'),
|
|
||||||
get selected() {
|
|
||||||
return this.name === query.mode;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'latest',
|
|
||||||
label: t('modes.latest'),
|
|
||||||
get selected() {
|
|
||||||
return this.name === query.mode;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
style={query.mode === 'latest' ? { paddingBottom: 0 } : {}}
|
|
||||||
/>
|
|
||||||
{query.mode === 'latest' ? (
|
|
||||||
<LatestSavedEnnoblements t={t} server={key} />
|
<LatestSavedEnnoblements t={t} server={key} />
|
||||||
) : (
|
|
||||||
<LiveEnnoblements t={t} server={key} />
|
|
||||||
)}
|
|
||||||
</Paper>
|
</Paper>
|
||||||
</Container>
|
</Container>
|
||||||
</Content>
|
</Content>
|
||||||
|
|
|
@ -1,34 +0,0 @@
|
||||||
import React from 'react';
|
|
||||||
import { useQuery } from '@apollo/client';
|
|
||||||
import { LIVE_ENNOBLEMENTS } from './queries';
|
|
||||||
|
|
||||||
import Table from '../Table/Table';
|
|
||||||
|
|
||||||
import { TFunction } from 'i18next';
|
|
||||||
import { LiveEnnoblementsQueryVariables } from '@libs/graphql/types';
|
|
||||||
import { LiveEnnoblements as LiveEnnoblementsT } from './types';
|
|
||||||
|
|
||||||
export interface Props {
|
|
||||||
server: string;
|
|
||||||
t: TFunction;
|
|
||||||
}
|
|
||||||
|
|
||||||
function LiveEnnoblements({ t, server }: Props) {
|
|
||||||
const { data: queryData, loading: queryLoading } = useQuery<
|
|
||||||
LiveEnnoblementsT,
|
|
||||||
LiveEnnoblementsQueryVariables
|
|
||||||
>(LIVE_ENNOBLEMENTS, {
|
|
||||||
fetchPolicy: 'cache-and-network',
|
|
||||||
variables: {
|
|
||||||
server,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const ennoblements = [...(queryData?.liveEnnoblements ?? [])].reverse();
|
|
||||||
const loading = ennoblements.length === 0 && queryLoading;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Table t={t} ennoblements={ennoblements} loading={loading} hideFooter />
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default LiveEnnoblements;
|
|
|
@ -1,31 +0,0 @@
|
||||||
import { gql } from '@apollo/client';
|
|
||||||
|
|
||||||
export const LIVE_ENNOBLEMENTS = gql`
|
|
||||||
query liveEnnoblements($server: String!) {
|
|
||||||
liveEnnoblements(server: $server) {
|
|
||||||
village {
|
|
||||||
name
|
|
||||||
x
|
|
||||||
y
|
|
||||||
id
|
|
||||||
}
|
|
||||||
newOwner {
|
|
||||||
id
|
|
||||||
name
|
|
||||||
tribe {
|
|
||||||
id
|
|
||||||
tag
|
|
||||||
}
|
|
||||||
}
|
|
||||||
oldOwner {
|
|
||||||
id
|
|
||||||
name
|
|
||||||
tribe {
|
|
||||||
id
|
|
||||||
tag
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ennobledAt
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`;
|
|
|
@ -1,29 +0,0 @@
|
||||||
export type Ennoblement = {
|
|
||||||
village: {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
x: number;
|
|
||||||
y: number;
|
|
||||||
};
|
|
||||||
newOwner: {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
tribe?: {
|
|
||||||
id: number;
|
|
||||||
tag: string;
|
|
||||||
};
|
|
||||||
};
|
|
||||||
oldOwner?: {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
tribe?: {
|
|
||||||
id: number;
|
|
||||||
tag: string;
|
|
||||||
};
|
|
||||||
};
|
|
||||||
ennobledAt: Date | string;
|
|
||||||
};
|
|
||||||
|
|
||||||
export type LiveEnnoblements = {
|
|
||||||
liveEnnoblements?: Ennoblement[];
|
|
||||||
};
|
|
|
@ -1,10 +1,5 @@
|
||||||
const translations = {
|
const translations = {
|
||||||
title_live: 'Live ennoblements - {{key}}',
|
title: 'Latest ennoblements - {{key}}',
|
||||||
title_latest: 'Latest ennoblements - {{key}}',
|
|
||||||
modes: {
|
|
||||||
live: 'Live',
|
|
||||||
latest: 'Latest',
|
|
||||||
},
|
|
||||||
table: {
|
table: {
|
||||||
columns: {
|
columns: {
|
||||||
ennobledAt: 'Date/time',
|
ennobledAt: 'Date/time',
|
||||||
|
|
|
@ -1,10 +1,5 @@
|
||||||
const translations = {
|
const translations = {
|
||||||
title_live: 'Przejęcia na żywo - {{key}}',
|
title: 'Ostatnie przejęcia - {{key}}',
|
||||||
title_latest: 'Ostatnie przejęcia - {{key}}',
|
|
||||||
modes: {
|
|
||||||
live: 'Na żywo',
|
|
||||||
latest: 'Ostatnie',
|
|
||||||
},
|
|
||||||
table: {
|
table: {
|
||||||
columns: {
|
columns: {
|
||||||
ennobledAt: 'Data',
|
ennobledAt: 'Data',
|
||||||
|
|
|
@ -1,10 +1,5 @@
|
||||||
const translations = {
|
const translations = {
|
||||||
title_live: 'Conquistas em tempo real - {{key}}',
|
title: 'Últimas conquistas - {{key}}',
|
||||||
title_latest: 'Últimas conquistas - {{key}}',
|
|
||||||
modes: {
|
|
||||||
live: 'Em tempo real',
|
|
||||||
latest: 'Mais recentes',
|
|
||||||
},
|
|
||||||
table: {
|
table: {
|
||||||
columns: {
|
columns: {
|
||||||
ennobledAt: 'Data/hora',
|
ennobledAt: 'Data/hora',
|
||||||
|
|
|
@ -1,10 +1,5 @@
|
||||||
const translations = {
|
const translations = {
|
||||||
title_live: 'Noblagens em tempo real - {{key}}',
|
title: 'Últimas noblagens - {{key}}',
|
||||||
title_latest: 'Últimas noblagens - {{key}}',
|
|
||||||
modes: {
|
|
||||||
live: 'Em tempo real',
|
|
||||||
latest: 'Mais recentes',
|
|
||||||
},
|
|
||||||
table: {
|
table: {
|
||||||
columns: {
|
columns: {
|
||||||
ennobledAt: 'Data/hora',
|
ennobledAt: 'Data/hora',
|
||||||
|
|
Reference in New Issue
Block a user