cleanup the ui and fix nextjs upgrade issues

This commit is contained in:
calli
2025-01-31 00:21:55 +02:00
parent dfeb307562
commit 2332d6f4d8
3 changed files with 13 additions and 52 deletions

View File

@@ -43,7 +43,7 @@ export const UploadDialog = ({
fileReader.readAsText(file);
}
}, [file]);
}, [file, closeDialog, restoreCharacters, validate]);
const changeHandler = (event: any) => {
setFile(event.target.files[0]);

View File

@@ -291,48 +291,12 @@ export const ProductionChainVisualization: React.FC<ProductionChainVisualization
)}
</Box>
</Box>
{inputs.length > 0 && (
<>
<Divider />
<Typography variant="caption" color="text.secondary">
Inputs per cycle:
</Typography>
<Stack spacing={0.5}>
{inputs.map(input => (
<Typography key={input.typeId} variant="caption" sx={{ pl: 2 }}>
{PI_TYPES_MAP[input.typeId]?.name}: {input.quantity} units
{factoryCount > 0 && ` (${(input.quantity * factoryCount).toFixed(0)} total)`}
</Typography>
))}
</Stack>
</>
)}
<Divider />
<Stack spacing={0.5}>
{factoryCount > 0 && (
<>
<Typography variant="caption" color="text.secondary">
Factories: {factoryCount}
</Typography>
{cycleTime && (
<Typography variant="caption" color="text.secondary">
Cycles per hour: {(3600 / cycleTime).toFixed(1)}
</Typography>
)}
</>
)}
{production > 0 && (
<>
<Typography variant="caption" color="success.main">
Production: {production.toFixed(1)} units total
</Typography>
{factoryCount > 0 && (
<Typography variant="caption" color="success.main">
({(production / factoryCount).toFixed(1)} units/factory)
</Typography>
)}
</>
)}
{consumption > 0 && (
@@ -340,11 +304,6 @@ export const ProductionChainVisualization: React.FC<ProductionChainVisualization
<Typography variant="caption" color="error.main">
Consumption: {consumption.toFixed(1)} units total
</Typography>
{factoryCount > 0 && (
<Typography variant="caption" color="error.main">
({(consumption / factoryCount).toFixed(1)} units/factory)
</Typography>
)}
</>
)}
{isImported && (
@@ -364,12 +323,6 @@ export const ProductionChainVisualization: React.FC<ProductionChainVisualization
sx={{ fontWeight: 'bold' }}
>
Net: {(production - consumption).toFixed(1)} units total
{factoryCount > 0 && (
<>
<br />
({((production - consumption) / factoryCount).toFixed(1)} units/factory)
</>
)}
</Typography>
</Stack>
</Paper>

View File

@@ -3,7 +3,7 @@ import "@fontsource/roboto/300.css";
import "@fontsource/roboto/400.css";
import "@fontsource/roboto/500.css";
import "@fontsource/roboto/700.css";
import { memo, useCallback, useEffect, useState } from "react";
import { memo, useCallback, useEffect, useState, Suspense } from "react";
import { AccessToken, CharacterUpdate, Env, PlanetWithInfo } from "../types";
import { MainGrid } from "./components/MainGrid";
import { refreshToken } from "@/esi-sso";
@@ -20,6 +20,7 @@ import { getPlanet, getPlanetUniverse, getPlanets } from "@/planets";
import { PlanetConfig } from "./components/PlanetConfig/PlanetConfigDialog";
const Home = () => {
const searchParams = useSearchParams();
const [characters, setCharacters] = useState<AccessToken[]>([]);
const [sessionReady, setSessionReady] = useState(false);
const [environment, setEnvironment] = useState<Env | undefined>(undefined);
@@ -31,8 +32,6 @@ const Home = () => {
const [colors, setColors] = useState<ColorSelectionType>(defaultColors);
const [alertMode, setAlertMode] = useState(false);
const searchParams = useSearchParams();
const code = searchParams && searchParams.get("code");
const deleteCharacter = (character: AccessToken) => {
const charactersToSave = characters.filter(
@@ -75,6 +74,7 @@ const Home = () => {
const handleCallback = async (
characters: AccessToken[],
): Promise<AccessToken[]> => {
const code = searchParams?.get("code");
if (code) {
window.history.replaceState(null, "", "/");
const res = await fetch(`api/token?code=${code}`);
@@ -246,6 +246,7 @@ const Home = () => {
}, ESI_CACHE_TIME_MS);
return () => clearInterval(interval);
});
return (
<SessionContext.Provider
value={{
@@ -281,4 +282,11 @@ const Home = () => {
);
};
export default memo(Home);
const HomeWrapper = () => (
<Suspense>
<Home />
</Suspense>
);
HomeWrapper.displayName = 'HomeWrapper';
export default memo(HomeWrapper);