Improve detailed view and fix formatting

This commit is contained in:
Corey 2024-04-16 13:12:30 +00:00
parent ed229129c9
commit f7954a70bd
2 changed files with 52 additions and 27 deletions

View File

@ -106,7 +106,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 1000}s`;
return `${(numValue / 1000).toFixed()}s`;
}
return '???';
},
@ -271,7 +271,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -283,7 +283,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -295,7 +295,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -307,7 +307,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -638,7 +638,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -664,7 +664,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -694,7 +694,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -775,7 +775,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},
@ -905,7 +905,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60 / 60}hr`;
return `${(numValue / 60 / 60).toFixed()}hr`;
}
return '???';
},
@ -916,7 +916,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60 / 60}hr`;
return `${(numValue / 60 / 60).toFixed()}hr`;
}
return '???';
},
@ -1161,10 +1161,6 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
return '???';
},
},
'MAP.ANTICHEAT_ENABLED': {
name: 'Anticheat',
description: 'Server side anti-cheating measurements active.',
},
'MAP.AUDIT_LINKSHELL': {
name: 'Logs Linkshell Chat',
description: '',
@ -1505,7 +1501,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue < 0 ? '' : '+'}${((50 + numValue) / 50 - 1) * 100}%`;
return `${numValue < 0 ? '' : '+'}${(((50 + numValue) / 50 - 1) * 100).toFixed()}%`;
}
return '???';
},
@ -1538,7 +1534,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue < 0 ? '' : '+'}${((40 + numValue) / 40 - 1) * 100}%`;
return `${numValue < 0 ? '' : '+'}${(((40 + numValue) / 40 - 1) * 100).toFixed()}%`;
}
return '???';
},
@ -1645,7 +1641,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${(1 / numValue) * 100}%`;
return `${((1 / numValue) * 100).toFixed()}%`;
}
return '???';
},
@ -1682,7 +1678,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue < 0 ? '' : '+'}${((50 + numValue) / 50 - 1) * 100}%`;
return `${numValue < 0 ? '' : '+'}${(((50 + numValue) / 50 - 1) * 100).toFixed()}%`;
}
return '???';
},
@ -1754,7 +1750,7 @@ export const ServerSettingsInfo: Record<string, ServerSetting> = {
transform: (arg) => {
const numValue = Number(arg);
if (!Number.isNaN(numValue)) {
return `${numValue / 60} min`;
return `${(numValue / 60).toFixed()} min`;
}
return '???';
},

View File

@ -23,6 +23,7 @@ import { AlertResponse } from '../components/Alert';
import ErrorCard from '../components/ErrorCard';
import ExpansionBar from '../components/ExpansionsBar';
import ServerData, {
ServerSetting,
ServerSettings,
ServerSettingsInfo,
} from '../data/ServerData';
@ -30,16 +31,19 @@ import CopyImageIcon from '../images/copy-image.png';
interface KeyValueRow {
id: number;
key: string;
name: string;
value: string | number | boolean;
description: string;
key: string;
rawValue: string | number | boolean;
}
const columns: GridColDef[] = [
{ field: 'key', headerName: 'Key', flex: 2 },
{ field: 'name', headerName: 'Name', flex: 1 },
{ field: 'name', headerName: 'Name', flex: 2 },
{ field: 'value', headerName: 'Value', flex: 1 },
{ field: 'description', headerName: 'Description', flex: 3 },
{ field: 'description', headerName: 'Description', flex: 4 },
{ field: 'key', headerName: 'Key', flex: 1 },
{ field: 'rawValue', headerName: 'Raw Value', flex: 1 },
];
function ServerSettingsDataGrid({
@ -47,13 +51,23 @@ function ServerSettingsDataGrid({
}: {
serverSettings: ServerSettings;
}) {
const transformValue = (
v: boolean | string | number,
setting: ServerSetting
): string | number | boolean => {
return setting.transform?.(v) ?? v;
};
const rows: KeyValueRow[] = Object.entries(serverSettings).map(
([key, value], index) => ({
id: index + 1,
key,
name: ServerSettingsInfo[key]?.name || 'none',
value,
name: ServerSettingsInfo[key]?.name || '',
value:
(ServerSettingsInfo[key] &&
transformValue(value, ServerSettingsInfo[key]).toString()) ||
'',
description: ServerSettingsInfo[key]?.description || '',
key,
rawValue: value,
})
);
@ -67,6 +81,21 @@ function ServerSettingsDataGrid({
density="compact"
hideFooterSelectedRowCount
showCellVerticalBorder
initialState={{
sorting: {
sortModel: [{ field: 'name', sort: 'asc' }],
},
filter: {
filterModel: {
items: [{ field: 'name', operator: 'isNotEmpty' }],
},
},
}}
sx={{
'& .MuiDataGrid-cell': {
userSelect: 'text',
},
}}
/>
</Box>
);