Validation; reformat source code

web
Alinson S. Xavier 4 months ago
parent 062b38514b
commit 6469840f0a

11
.gitignore vendored

@ -1,3 +1,4 @@
*-off.md
*.bak
*.gz
*.ipynb
@ -19,6 +20,7 @@
.apdisk
.com.apple.timemachine.donotpresent
.fseventsd
.idea
.ipy*
.vscode
Icon
@ -32,12 +34,11 @@ benchmark/tables
benchmark/tmp.json
build
docs/_build
docs/src/tutorials/customizing.md
docs/src/tutorials/lmp.md
docs/src/tutorials/market.md
docs/src/tutorials/usage.md
instances/**/*.json
instances/_source
local
notebooks
docs/src/tutorials/usage.md
docs/src/tutorials/customizing.md
docs/src/tutorials/market.md
docs/src/tutorials/lmp.md
*-off.md

3031
web/package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -16,8 +16,8 @@
"@types/papaparse": "^5.3.16",
"@types/react": "^19.1.3",
"@types/react-dom": "^19.1.3",
"@typescript-eslint/utils": "^8.32.1",
"ajv": "^8.17.1",
"eslint": "^8.57.1",
"papaparse": "^5.5.2",
"react": "^19.1.0",
"react-dom": "^19.1.0",
@ -58,6 +58,6 @@
},
"devDependencies": {
"@types/tabulator-tables": "^6.2.6",
"eslint": "^8.57.1"
"prettier": "3.5.3"
}
}

@ -1,14 +1,11 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="UnitCommitment.jl Case Builder"
/>
<meta name="description" content="UnitCommitment.jl Case Builder" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>Case Builder - UnitCommitment.jl</title>

@ -4,81 +4,105 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import {UnitCommitmentScenario} from "../../../core/data";
import {changeBusData, createBus, deleteBus, renameBus} from "./BusOperations";
import { UnitCommitmentScenario } from "../../../core/data";
import {
changeBusData,
createBus,
deleteBus,
renameBus,
} from "./BusOperations";
import assert from "node:assert";
export const BUS_TEST_DATA_1: UnitCommitmentScenario = {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
"Buses": {
"b1": {"Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044]},
"b2": {"Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939]},
"b3": {"Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268]},
}
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
Buses: {
b1: { "Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044] },
b2: { "Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939] },
b3: { "Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268] },
},
};
test("createBus", () => {
const newScenario = createBus(BUS_TEST_DATA_1);
assert.deepEqual(Object.keys(newScenario.Buses), ["b1", "b2", "b3", "b4"]);
const newScenario = createBus(BUS_TEST_DATA_1);
assert.deepEqual(Object.keys(newScenario.Buses), ["b1", "b2", "b3", "b4"]);
});
test("changeBusData", () => {
let scenario = BUS_TEST_DATA_1;
scenario = changeBusData("b1", "Load 0", "99", scenario);
scenario = changeBusData("b1", "Load 3", "99", scenario);
scenario = changeBusData("b3", "Load 4", "99", scenario);
assert.deepEqual(scenario, {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
"Buses": {
"b1": {"Load (MW)": [99, 34.38835, 33.45083, 99, 33.25044]},
"b2": {"Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939]},
"b3": {"Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 99]},
}
});
let scenario = BUS_TEST_DATA_1;
let err = null;
[scenario, err] = changeBusData("b1", "Load 0", "99", scenario);
assert.equal(err, null);
[scenario, err] = changeBusData("b1", "Load 3", "99", scenario);
assert.equal(err, null);
[scenario, err] = changeBusData("b3", "Load 4", "99", scenario);
assert.equal(err, null);
assert.deepEqual(scenario, {
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
Buses: {
b1: { "Load (MW)": [99, 34.38835, 33.45083, 99, 33.25044] },
b2: { "Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939] },
b3: { "Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 99] },
},
});
});
test("deleteBus", () => {
let scenario = BUS_TEST_DATA_1;
scenario = deleteBus("b2", scenario);
assert.deepEqual(scenario, {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
"Buses": {
"b1": {"Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044]},
"b3": {"Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268]},
}
});
test("changeBusData with invalid numbers", () => {
let [, err] = changeBusData("b1", "Load 0", "xx", BUS_TEST_DATA_1);
assert(err !== null);
assert.equal(err.message, "Invalid value: xx");
});
test("deleteBus", () => {
let scenario = BUS_TEST_DATA_1;
scenario = deleteBus("b2", scenario);
assert.deepEqual(scenario, {
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
Buses: {
b1: { "Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044] },
b3: { "Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268] },
},
});
});
test("renameBus", () => {
let scenario = BUS_TEST_DATA_1;
scenario = renameBus("b2", "b99", scenario);
assert.deepEqual(scenario, {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
"Buses": {
"b1": {"Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044]},
"b99": {"Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939]},
"b3": {"Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268]},
}
});
let [scenario, err] = renameBus("b2", "b99", BUS_TEST_DATA_1);
assert(err === null);
assert.deepEqual(scenario, {
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 5,
"Time step (min)": 60,
},
Buses: {
b1: { "Load (MW)": [35.79534, 34.38835, 33.45083, 32.89729, 33.25044] },
b99: { "Load (MW)": [14.03739, 13.48563, 13.11797, 12.9009, 13.03939] },
b3: { "Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268] },
},
});
});
test("renameBus with duplicated name", () => {
let [, err] = renameBus("b3", "b1", BUS_TEST_DATA_1);
assert(err != null);
assert.equal(err.message, `Bus b1 already exists`);
});

@ -4,78 +4,103 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import {Buses, UnitCommitmentScenario} from "../../../core/data";
import { Buses, UnitCommitmentScenario } from "../../../core/data";
import { ValidationError } from "../../../core/Validation/validate";
function generateUniqueBusName(scenario: UnitCommitmentScenario) {
let newBusName = "b";
let counter = 1;
let name = `${newBusName}${counter}`;
while (name in scenario.Buses) {
counter++;
name = `${newBusName}${counter}`;
}
return name;
}
const generateUniqueBusName = (scenario: UnitCommitmentScenario) => {
let newBusName = "b";
let counter = 1;
let name = `${newBusName}${counter}`;
while (name in scenario.Buses) {
counter++;
name = `${newBusName}${counter}`;
}
return name;
};
function generateDefaultBusLoad(scenario: UnitCommitmentScenario) {
const T = scenario.Parameters["Time horizon (h)"] * (60 / scenario.Parameters["Time step (min)"]);
return new Array(T).fill(0);
}
const generateDefaultBusLoad = (scenario: UnitCommitmentScenario) => {
const T =
scenario.Parameters["Time horizon (h)"] *
(60 / scenario.Parameters["Time step (min)"]);
return new Array(T).fill(0);
};
export function createBus(scenario: UnitCommitmentScenario) {
const load = generateDefaultBusLoad(scenario);
let name = generateUniqueBusName(scenario);
return {
...scenario,
"Buses": {
...scenario.Buses,
[name]: {
"Load (MW)": load
}
}
};
}
export const createBus = (scenario: UnitCommitmentScenario) => {
const load = generateDefaultBusLoad(scenario);
let name = generateUniqueBusName(scenario);
return {
...scenario,
Buses: {
...scenario.Buses,
[name]: {
"Load (MW)": load,
},
},
};
};
export function changeBusData(bus: string, field: string, newValue: string, scenario: UnitCommitmentScenario) {
// Load (MW)
const match = field.match(/Load (\d+)/);
if(match) {
const idx = parseInt(match[1]!, 10);
const newLoad = [...scenario.Buses[bus]!["Load (MW)"]];
newLoad[idx] = parseFloat(newValue);
return {
...scenario,
Buses: {
...scenario.Buses,
[bus]: {
"Load (MW)": newLoad,
}
}
};
export const changeBusData = (
bus: string,
field: string,
newValueStr: string,
scenario: UnitCommitmentScenario,
): [UnitCommitmentScenario, ValidationError | null] => {
// Load (MW)
const match = field.match(/Load (\d+)/);
if (match) {
const newValueFloat = parseFloat(newValueStr);
if (isNaN(newValueFloat)) {
return [scenario, { message: `Invalid value: ${newValueStr}` }];
}
const idx = parseInt(match[1]!, 10);
const newLoad = [...scenario.Buses[bus]!["Load (MW)"]];
newLoad[idx] = newValueFloat;
return [
{
...scenario,
Buses: {
...scenario.Buses,
[bus]: {
"Load (MW)": newLoad,
},
},
},
null,
];
}
throw Error(`Unknown field: ${field}`);
}
throw Error(`Unknown field: ${field}`);
};
export function deleteBus(bus: string, scenario: UnitCommitmentScenario) {
const { [bus]: _, ...newBuses} = scenario.Buses;
return {
...scenario,
Buses: newBuses
};
}
export const deleteBus = (bus: string, scenario: UnitCommitmentScenario) => {
const { [bus]: _, ...newBuses } = scenario.Buses;
return {
...scenario,
Buses: newBuses,
};
};
export function renameBus(oldName: string, newName: string, scenario: UnitCommitmentScenario) {
const newBuses: Buses = Object.keys(scenario.Buses).reduce((acc, val) => {
if(val === oldName) {
acc[newName] = scenario.Buses[val]!;
} else {
acc[val] = scenario.Buses[val]!;
}
return acc;
}, {} as Buses);
return {
...scenario,
Buses: newBuses
};
}
export const renameBus = (
oldName: string,
newName: string,
scenario: UnitCommitmentScenario,
): [UnitCommitmentScenario, ValidationError | null] => {
if (newName in scenario.Buses) {
return [scenario, { message: `Bus ${newName} already exists` }];
}
const newBuses: Buses = Object.keys(scenario.Buses).reduce((acc, val) => {
if (val === oldName) {
acc[newName] = scenario.Buses[val]!;
} else {
acc[val] = scenario.Buses[val]!;
}
return acc;
}, {} as Buses);
return [
{
...scenario,
Buses: newBuses,
},
null,
];
};

@ -1,58 +0,0 @@
/*
* UnitCommitment.jl: Optimization Package for Security-Constrained Unit Commitment
* Copyright (C) 2020-2025, UChicago Argonne, LLC. All rights reserved.
* Released under the modified BSD license. See COPYING.md for more details.
*/
import SectionHeader from "../../Common/SectionHeader/SectionHeader";
import {UnitCommitmentScenario} from "../../../core/data";
import BusesTable, {generateBusesCsv, parseBusesCsv} from "./BusesTable";
import SectionButton from "../../Common/Buttons/SectionButton";
import {faDownload, faPlus, faUpload} from "@fortawesome/free-solid-svg-icons";
import {offerDownload} from "../../Common/io";
import FileUploadElement from "../../Common/Buttons/FileUploadElement";
import {useRef} from "react";
interface BusesProps {
scenario: UnitCommitmentScenario,
onBusCreated: () => void,
onBusDataChanged: (bus: string, field: string, newValue: string) => void,
onBusDeleted: (bus: string) => void,
onBusRenamed: (oldName: string, newName: string) => void,
onDataChanged: (scenario: UnitCommitmentScenario) => void,
}
function BusesComponent(props: BusesProps) {
const fileUploadElem = useRef<FileUploadElement>(null);
const onDownload = () => {
const csvContents = generateBusesCsv(props.scenario);
offerDownload(csvContents, "text/csv", "buses.csv");
};
const onUpload = () => {
fileUploadElem.current!.showFilePicker((csvContents: any) => {
const newScenario = parseBusesCsv(props.scenario, csvContents);
props.onDataChanged(newScenario);
});
};
return (
<div>
<SectionHeader title="Buses">
<SectionButton icon={faPlus} tooltip="Add" onClick={props.onBusCreated}/>
<SectionButton icon={faDownload} tooltip="Download" onClick={onDownload}/>
<SectionButton icon={faUpload} tooltip="Upload" onClick={onUpload}/>
</SectionHeader>
<BusesTable
scenario={props.scenario}
onBusDataChanged={props.onBusDataChanged}
onBusDeleted={props.onBusDeleted}
onBusRenamed={props.onBusRenamed}
/>
<FileUploadElement ref={fileUploadElem} accept=".csv"/>
</div>
);
}
export default BusesComponent;

@ -0,0 +1,75 @@
/*
* UnitCommitment.jl: Optimization Package for Security-Constrained Unit Commitment
* Copyright (C) 2020-2025, UChicago Argonne, LLC. All rights reserved.
* Released under the modified BSD license. See COPYING.md for more details.
*/
import SectionHeader from "../../Common/SectionHeader/SectionHeader";
import { UnitCommitmentScenario } from "../../../core/data";
import BusesTable, { generateBusesCsv, parseBusesCsv } from "./BusesTable";
import SectionButton from "../../Common/Buttons/SectionButton";
import {
faDownload,
faPlus,
faUpload,
} from "@fortawesome/free-solid-svg-icons";
import { offerDownload } from "../../Common/io";
import FileUploadElement from "../../Common/Buttons/FileUploadElement";
import { useRef } from "react";
import { ValidationError } from "../../../core/Validation/validate";
interface BusesProps {
scenario: UnitCommitmentScenario;
onBusCreated: () => void;
onBusDataChanged: (
bus: string,
field: string,
newValue: string,
) => ValidationError | null;
onBusDeleted: (bus: string) => void;
onBusRenamed: (oldName: string, newName: string) => ValidationError | null;
onDataChanged: (scenario: UnitCommitmentScenario) => void;
}
function BusesComponent(props: BusesProps) {
const fileUploadElem = useRef<FileUploadElement>(null);
const onDownload = () => {
const csvContents = generateBusesCsv(props.scenario);
offerDownload(csvContents, "text/csv", "buses.csv");
};
const onUpload = () => {
fileUploadElem.current!.showFilePicker((csvContents: any) => {
const newScenario = parseBusesCsv(props.scenario, csvContents);
props.onDataChanged(newScenario);
});
};
return (
<div>
<SectionHeader title="Buses">
<SectionButton
icon={faPlus}
tooltip="Add"
onClick={props.onBusCreated}
/>
<SectionButton
icon={faDownload}
tooltip="Download"
onClick={onDownload}
/>
<SectionButton icon={faUpload} tooltip="Upload" onClick={onUpload} />
</SectionHeader>
<BusesTable
scenario={props.scenario}
onBusDataChanged={props.onBusDataChanged}
onBusDeleted={props.onBusDeleted}
onBusRenamed={props.onBusRenamed}
/>
<FileUploadElement ref={fileUploadElem} accept=".csv" />
</div>
);
}
export default BusesComponent;

@ -5,64 +5,51 @@
*/
import assert from "node:assert";
import {generateBusesCsv, parseBusesCsv} from "./BusesTable";
import {BUS_TEST_DATA_1} from "./BusOperations.test";
import { generateBusesCsv, parseBusesCsv } from "./BusesTable";
import { BUS_TEST_DATA_1 } from "./BusOperations.test";
test("generate CSV", () => {
const actualCsv = generateBusesCsv(BUS_TEST_DATA_1);
const expectedCsv =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,35.79534,34.38835,33.45083,32.89729,33.25044\n" +
"b2,14.03739,13.48563,13.11797,12.9009,13.03939\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
assert.strictEqual(actualCsv, expectedCsv);
const actualCsv = generateBusesCsv(BUS_TEST_DATA_1);
const expectedCsv =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,35.79534,34.38835,33.45083,32.89729,33.25044\n" +
"b2,14.03739,13.48563,13.11797,12.9009,13.03939\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
assert.strictEqual(actualCsv, expectedCsv);
});
test("parse valid CSV", () => {
const csvContents =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,0,1,2,3,4\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
const newScenario = parseBusesCsv(BUS_TEST_DATA_1, csvContents);
assert.deepEqual(newScenario.Buses, {
"b1": {
"Load (MW)": [
0,
1,
2,
3,
4,
]
},
"b3": {
"Load (MW)": [
27.3729,
26.29698,
25.58005,
25.15675,
25.4268,
]
},
});
const csvContents =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,0,1,2,3,4\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
const newScenario = parseBusesCsv(BUS_TEST_DATA_1, csvContents);
assert.deepEqual(newScenario.Buses, {
b1: {
"Load (MW)": [0, 1, 2, 3, 4],
},
b3: {
"Load (MW)": [27.3729, 26.29698, 25.58005, 25.15675, 25.4268],
},
});
});
test("parse invalid CSV (wrong headers)", () => {
const csvContents =
"Name,Load 5,Load 7,Load 23,Load 3,Load 4\n" +
"b1,0,1,2,3,4\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
expect(() => {
parseBusesCsv(BUS_TEST_DATA_1, csvContents);
}).toThrow(Error);
const csvContents =
"Name,Load 5,Load 7,Load 23,Load 3,Load 4\n" +
"b1,0,1,2,3,4\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
expect(() => {
parseBusesCsv(BUS_TEST_DATA_1, csvContents);
}).toThrow(Error);
});
test("parse invalid CSV (wrong data length)", () => {
const csvContents =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,0,1,2,3\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
expect(() => {
parseBusesCsv(BUS_TEST_DATA_1, csvContents);
}).toThrow(Error);
const csvContents =
"Name,Load 0,Load 1,Load 2,Load 3,Load 4\n" +
"b1,0,1,2,3\n" +
"b3,27.3729,26.29698,25.58005,25.15675,25.4268";
expect(() => {
parseBusesCsv(BUS_TEST_DATA_1, csvContents);
}).toThrow(Error);
});

@ -4,174 +4,195 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import Papa from 'papaparse';
import {Buses, UnitCommitmentScenario} from "../../../core/data";
import {useEffect, useRef} from "react";
import {CellComponent, ColumnDefinition, TabulatorFull as Tabulator} from "tabulator-tables";
import Papa from "papaparse";
import { Buses, UnitCommitmentScenario } from "../../../core/data";
import { useEffect, useRef } from "react";
import {
CellComponent,
ColumnDefinition,
TabulatorFull as Tabulator,
} from "tabulator-tables";
import { ValidationError } from "../../../core/Validation/validate";
const generateBusesTableData = (scenario: UnitCommitmentScenario) => {
const tableData: { [name: string]: any }[] = [];
for (const [busName, busData] of Object.entries(scenario.Buses)) {
const entry: { [key: string]: any } = {};
entry["Name"] = busName;
for (const [i, mw] of Object.entries(busData["Load (MW)"])) {
entry[`Load ${i}`] = mw;
}
tableData.push(entry);
const tableData: { [name: string]: any }[] = [];
for (const [busName, busData] of Object.entries(scenario.Buses)) {
const entry: { [key: string]: any } = {};
entry["Name"] = busName;
for (const [i, mw] of Object.entries(busData["Load (MW)"])) {
entry[`Load ${i}`] = mw;
}
return tableData;
tableData.push(entry);
}
return tableData;
};
const generateBusesTableColumns = (scenario: UnitCommitmentScenario): [ColumnDefinition] => {
const timeHorizonHours = scenario["Parameters"]["Time horizon (h)"];
const timeStepMin = scenario["Parameters"]["Time step (min)"];
const columnsCommonAttrs: ColumnDefinition = {
title: "",
editor: "input",
editorParams: {
selectContents: true,
},
headerHozAlign: "right",
cssClass: "custom-cell-style",
headerWordWrap: true,
formatter: "plaintext",
headerSort: false,
resizable: false,
};
const columns: [ColumnDefinition] = [
{
...columnsCommonAttrs,
title: "Name",
field: "Name",
width: 150,
},
];
for (let m = 0, offset = 0; m < timeHorizonHours * 60; m += timeStepMin, offset += 1) {
const hours = Math.floor(m / 60);
const mins = m % 60;
const formattedTime = `${String(hours).padStart(2, '0')}:${String(mins).padStart(2, '0')}`;
columns.push({
...columnsCommonAttrs,
title: `Load (MW)<div class="subtitle">${formattedTime}</div>`,
field: `Load ${offset}`,
width: 100,
});
}
return columns;
const generateBusesTableColumns = (
scenario: UnitCommitmentScenario,
): [ColumnDefinition] => {
const timeHorizonHours = scenario["Parameters"]["Time horizon (h)"];
const timeStepMin = scenario["Parameters"]["Time step (min)"];
const columnsCommonAttrs: ColumnDefinition = {
title: "",
editor: "input",
editorParams: {
selectContents: true,
},
headerHozAlign: "right",
cssClass: "custom-cell-style",
headerWordWrap: true,
formatter: "plaintext",
headerSort: false,
resizable: false,
};
const columns: [ColumnDefinition] = [
{
...columnsCommonAttrs,
title: "Name",
field: "Name",
width: 150,
},
];
for (
let m = 0, offset = 0;
m < timeHorizonHours * 60;
m += timeStepMin, offset += 1
) {
const hours = Math.floor(m / 60);
const mins = m % 60;
const formattedTime = `${String(hours).padStart(2, "0")}:${String(mins).padStart(2, "0")}`;
columns.push({
...columnsCommonAttrs,
title: `Load (MW)<div class="subtitle">${formattedTime}</div>`,
field: `Load ${offset}`,
width: 100,
});
}
return columns;
};
export const generateBusesCsv = (scenario: UnitCommitmentScenario) => {
const columns = generateBusesTableColumns(scenario);
const csvHeader = columns.map(row => row.field).join(",");
const csvBody = Object.entries(scenario.Buses).map(([busName, busData]) => {
const csvLoad = busData["Load (MW)"].join(",");
return `${busName},${csvLoad}`;
}).join("\n");
return `${csvHeader}\n${csvBody}`;
const columns = generateBusesTableColumns(scenario);
const csvHeader = columns.map((row) => row.field).join(",");
const csvBody = Object.entries(scenario.Buses)
.map(([busName, busData]) => {
const csvLoad = busData["Load (MW)"].join(",");
return `${busName},${csvLoad}`;
})
.join("\n");
return `${csvHeader}\n${csvBody}`;
};
function getNumTimesteps(scenario: UnitCommitmentScenario) {
return scenario.Parameters["Time horizon (h)"] * scenario.Parameters["Time step (min)"] / 60;
return (
(scenario.Parameters["Time horizon (h)"] *
scenario.Parameters["Time step (min)"]) /
60
);
}
export const parseBusesCsv = (scenario: UnitCommitmentScenario, csvData: string): UnitCommitmentScenario => {
const results = Papa.parse(csvData, {
header: true,
skipEmptyLines: true,
transformHeader: (header) => header.trim(),
transform: (value) => value.trim()
});
// Check for parsing errors
if (results.errors.length > 0) {
throw Error(`Invalid CSV: Parsing error: ${results.errors}`);
export const parseBusesCsv = (
scenario: UnitCommitmentScenario,
csvData: string,
): UnitCommitmentScenario => {
const results = Papa.parse(csvData, {
header: true,
skipEmptyLines: true,
transformHeader: (header) => header.trim(),
transform: (value) => value.trim(),
});
// Check for parsing errors
if (results.errors.length > 0) {
throw Error(`Invalid CSV: Parsing error: ${results.errors}`);
}
// Check CSV headers
const expectedFields = generateBusesTableColumns(scenario).map(
(col) => col.field,
)!;
const actualFields = results.meta.fields!;
for (let i = 0; i < expectedFields.length; i++) {
if (expectedFields[i] !== actualFields[i]) {
throw Error(`Invalid CSV: Header mismatch at column ${i + 1}"`);
}
// Check CSV headers
const expectedFields = generateBusesTableColumns(scenario).map(col => col.field)!;
const actualFields = results.meta.fields!;
for (let i = 0; i < expectedFields.length; i++) {
if (expectedFields[i] !== actualFields[i]) {
throw Error(`Invalid CSV: Header mismatch at column ${i + 1}"`);
}
}
// Parse each row
const T = getNumTimesteps(scenario);
const buses: Buses = {};
for (let i = 0; i < results.data.length; i++) {
const row = results.data[i] as { [key: string]: any };
const busName = row["Name"] as string;
const busLoad: number[] = Array(T);
for (let j = 0; j < T; j++) {
busLoad[j] = parseFloat(row[`Load ${j}`]);
}
// Parse each row
const T = getNumTimesteps(scenario);
const buses: Buses = {};
for (let i = 0; i < results.data.length; i++) {
const row = results.data[i] as { [key: string]: any };
const busName = row["Name"] as string;
const busLoad: number[] = Array(T);
for (let j = 0; j < T; j++) {
busLoad[j] = parseFloat(row[`Load ${j}`]);
}
buses[busName] = {
"Load (MW)": busLoad
};
}
return {
...scenario,
Buses: buses,
buses[busName] = {
"Load (MW)": busLoad,
};
}
return {
...scenario,
Buses: buses,
};
};
interface BusesTableProps {
scenario: UnitCommitmentScenario
onBusDataChanged: (bus: string, field: string, newValue: string) => void,
onBusDeleted: (bus: string) => void,
onBusRenamed: (oldName: string, newName: string) => void,
scenario: UnitCommitmentScenario;
onBusDataChanged: (
bus: string,
field: string,
newValue: string,
) => ValidationError | null;
onBusDeleted: (bus: string) => void;
onBusRenamed: (oldName: string, newName: string) => ValidationError | null;
}
function BusesTable(props: BusesTableProps) {
const tableContainerRef = useRef<HTMLDivElement | null>(null);
useEffect(() => {
const onCellEdited = (cell: CellComponent) => {
let newValue = cell.getValue();
let oldValue = cell.getOldValue();
if (newValue === oldValue) return;
if (cell.getField() === "Name") {
if (newValue === "") {
props.onBusDeleted(oldValue);
cell.getRow().delete();
} else {
props.onBusRenamed(
oldValue,
newValue,
);
}
} else {
const row = cell.getRow().getData();
const bus = row["Name"];
props.onBusDataChanged(
bus, cell.getField(), newValue
);
}
};
if (tableContainerRef.current === null) return;
const table = new Tabulator(tableContainerRef.current, {
layout: "fitColumns",
data: generateBusesTableData(props.scenario),
columns: generateBusesTableColumns(props.scenario),
maxHeight: "500px",
});
table.on("cellEdited", (cell) => {
onCellEdited(cell);
});
table.on("cellEditing", (cell) => {
});
// table.on("scrollHorizontal", (left, leftDir) => {
// console.log(left, leftDir);
// });
table.rowManager.scrollHorizontal(100, false);
// table.columnManager.scrollHorizontal(100, false);
}, [props, props.scenario]);
return <div className="tableContainer" ref={tableContainerRef}/>;
const tableContainerRef = useRef<HTMLDivElement | null>(null);
useEffect(() => {
const scenario = props.scenario;
const onCellEdited = (cell: CellComponent) => {
let newValue = cell.getValue();
let oldValue = cell.getOldValue();
// eslint-disable-next-line eqeqeq
if (newValue == oldValue) return;
if (cell.getField() === "Name") {
if (newValue === "") {
props.onBusDeleted(oldValue);
cell.getRow().delete();
} else {
const err = props.onBusRenamed(oldValue, newValue);
if (err) {
cell.restoreOldValue();
}
}
} else {
const row = cell.getRow().getData();
const bus = row["Name"];
const err = props.onBusDataChanged(bus, cell.getField(), newValue);
if (err) {
cell.restoreOldValue();
}
}
};
if (tableContainerRef.current === null) return;
const table = new Tabulator(tableContainerRef.current, {
layout: "fitColumns",
data: generateBusesTableData(scenario),
columns: generateBusesTableColumns(scenario),
maxHeight: "500px",
});
table.on("cellEdited", (cell) => {
onCellEdited(cell);
});
}, [props]);
return <div className="tableContainer" ref={tableContainerRef} />;
}
export default BusesTable;

@ -6,83 +6,107 @@
import Header from "./Header/Header";
import Parameters from "./Parameters/Parameters";
import BusesComponent from "./Buses/Buses";
import {BLANK_SCENARIO, TEST_SCENARIO, UnitCommitmentScenario} from "../../core/data";
import BusesComponent from "./Buses/BusesComponent";
import {
BLANK_SCENARIO,
TEST_SCENARIO,
UnitCommitmentScenario,
} from "../../core/data";
import "tabulator-tables/dist/css/tabulator.min.css";
import "../Common/Forms/Tables.css";
import {useState} from "react";
import { useState } from "react";
import Footer from "./Footer/Footer";
import {validate} from "../../core/Validation/validate";
import {offerDownload} from "../Common/io";
import {changeBusData, createBus, deleteBus, renameBus} from "./Buses/BusOperations";
import { validate, ValidationError } from "../../core/Validation/validate";
import { offerDownload } from "../Common/io";
import {
changeBusData,
createBus,
deleteBus,
renameBus,
} from "./Buses/BusOperations";
const CaseBuilder = () => {
const [scenario, setScenario] = useState(TEST_SCENARIO);
const [scenario, setScenario] = useState(TEST_SCENARIO);
const onClear = () => {
setScenario(BLANK_SCENARIO);
};
const onClear = () => {
setScenario(BLANK_SCENARIO);
};
const onSave = () => {
offerDownload(
JSON.stringify(scenario, null, 2),
'application/json',
'case.json',
);
};
const onSave = () => {
offerDownload(
JSON.stringify(scenario, null, 2),
"application/json",
"case.json",
);
};
const onBusCreated = () => {
const newScenario = createBus(scenario);
setScenario(newScenario);
};
const onBusCreated = () => {
const newScenario = createBus(scenario);
setScenario(newScenario);
};
const onBusDataChanged = (bus: string, field: string, newValue: string) => {
const newScenario = changeBusData(bus, field, newValue, scenario);
setScenario(newScenario);
};
const onBusDataChanged = (
bus: string,
field: string,
newValue: string,
): ValidationError | null => {
const [newScenario, err] = changeBusData(bus, field, newValue, scenario);
if (err) {
console.log(err);
return err;
}
setScenario(newScenario);
return null;
};
const onBusDeleted = (bus: string) => {
const newScenario = deleteBus(bus, scenario);
setScenario(newScenario);
};
const onBusDeleted = (bus: string) => {
const newScenario = deleteBus(bus, scenario);
setScenario(newScenario);
};
const onBusRenamed = (oldName: string, newName: string) => {
const newScenario = renameBus(oldName, newName, scenario);
setScenario(newScenario);
};
const onBusRenamed = (
oldName: string,
newName: string,
): ValidationError | null => {
const [newScenario, err] = renameBus(oldName, newName, scenario);
if (err) {
console.log(err);
return err;
}
setScenario(newScenario);
return null;
};
const onDataChanged = (newScenario: UnitCommitmentScenario) => {
setScenario(newScenario);
};
const onDataChanged = (newScenario: UnitCommitmentScenario) => {
setScenario(newScenario);
};
const onLoad = (scenario: UnitCommitmentScenario) => {
if (!validate(scenario)) {
console.error(validate.errors);
return;
}
setScenario(scenario);
};
const onLoad = (scenario: UnitCommitmentScenario) => {
if (!validate(scenario)) {
console.error(validate.errors);
return;
}
setScenario(scenario);
};
return <div>
<Header
onClear={onClear}
onSave={onSave}
onLoad={onLoad}
return (
<div>
<Header onClear={onClear} onSave={onSave} onLoad={onLoad} />
<div className="content">
<Parameters scenario={scenario} />
<BusesComponent
scenario={scenario}
onBusCreated={onBusCreated}
onBusDataChanged={onBusDataChanged}
onBusRenamed={onBusRenamed}
onBusDeleted={onBusDeleted}
onDataChanged={onDataChanged}
/>
<div className="content">
<Parameters scenario={scenario}/>
<BusesComponent
scenario={scenario}
onBusCreated={onBusCreated}
onBusDataChanged={onBusDataChanged}
onBusRenamed={onBusRenamed}
onBusDeleted={onBusDeleted}
onDataChanged={onDataChanged}
/>
</div>
<Footer/>
</div>;
</div>
<Footer />
</div>
);
};
export default CaseBuilder;

@ -5,10 +5,10 @@
*/
.Footer {
background-color: #333;
text-align: center;
color: #aaa;
font-size: 14px;
padding: 16px;
line-height: 24px;
background-color: #333;
text-align: center;
color: #aaa;
font-size: 14px;
padding: 16px;
line-height: 24px;
}

@ -7,12 +7,13 @@
import styles from "./Footer.module.css";
function Footer() {
return (
<div className={styles.Footer}>
UnitCommitment.jl: Optimization Package for Security-Constrained Unit Commitment <br/>
Copyright (C) 2020-2025, UChicago Argonne, LLC. All rights reserved.
</div>
);
return (
<div className={styles.Footer}>
UnitCommitment.jl: Optimization Package for Security-Constrained Unit
Commitment <br />
Copyright (C) 2020-2025, UChicago Argonne, LLC. All rights reserved.
</div>
);
}
export default Footer;

@ -5,38 +5,37 @@
*/
.HeaderBox {
background-color: var(--contrast-0);
border-bottom: var(--box-border);
box-shadow: var(--box-shadow);
padding: 0;
margin: 0;
background-color: var(--contrast-0);
border-bottom: var(--box-border);
box-shadow: var(--box-shadow);
padding: 0;
margin: 0;
}
.HeaderContent {
margin: 0 auto;
max-width: var(--site-max-width);
min-width: var(--site-min-width);
margin: 0 auto;
max-width: var(--site-max-width);
min-width: var(--site-min-width);
}
.HeaderContent h1, h2 {
color: var(--contrast-100);
display: inline-block;
line-height: 48px;
font-size: 28px;
margin: 0;
padding: 12px;
.HeaderContent h1,
h2 {
color: var(--contrast-100);
display: inline-block;
line-height: 48px;
font-size: 28px;
margin: 0;
padding: 12px;
}
.HeaderContent h2 {
display: inline-block;
font-size: 22px;
color: var(--contrast-80);
font-weight: normal;
display: inline-block;
font-size: 22px;
color: var(--contrast-80);
font-weight: normal;
}
.buttonContainer {
float: right;
padding: 16px 12px;
float: right;
padding: 16px 12px;
}

@ -6,40 +6,40 @@
import styles from "./Header.module.css";
import SiteHeaderButton from "../../Common/Buttons/SiteHeaderButton";
import {UnitCommitmentScenario} from "../../../core/data";
import {useRef} from "react";
import { UnitCommitmentScenario } from "../../../core/data";
import { useRef } from "react";
import FileUploadElement from "../../Common/Buttons/FileUploadElement";
interface HeaderProps {
onClear: () => void
onSave: () => void
onLoad: (data: UnitCommitmentScenario) => void
onClear: () => void;
onSave: () => void;
onLoad: (data: UnitCommitmentScenario) => void;
}
function Header(props: HeaderProps) {
const fileElem = useRef<FileUploadElement>(null);
const fileElem = useRef<FileUploadElement>(null);
function onLoad() {
fileElem.current!.showFilePicker((data: any) => {
const scenario = JSON.parse(data) as UnitCommitmentScenario;
props.onLoad(scenario);
});
}
function onLoad() {
fileElem.current!.showFilePicker((data: any) => {
const scenario = JSON.parse(data) as UnitCommitmentScenario;
props.onLoad(scenario);
});
}
return (
<div className={styles.HeaderBox}>
<div className={styles.HeaderContent}>
<h1>UnitCommitment.jl</h1>
<h2>Case Builder</h2>
<div className={styles.buttonContainer}>
<SiteHeaderButton title="Clear" onClick={props.onClear}/>
<SiteHeaderButton title="Load" onClick={onLoad}/>
<SiteHeaderButton title="Save" onClick={props.onSave}/>
</div>
<FileUploadElement ref={fileElem} accept=".json"/>
</div>
return (
<div className={styles.HeaderBox}>
<div className={styles.HeaderContent}>
<h1>UnitCommitment.jl</h1>
<h2>Case Builder</h2>
<div className={styles.buttonContainer}>
<SiteHeaderButton title="Clear" onClick={props.onClear} />
<SiteHeaderButton title="Load" onClick={onLoad} />
<SiteHeaderButton title="Save" onClick={props.onSave} />
</div>
);
<FileUploadElement ref={fileElem} accept=".json" />
</div>
</div>
);
}
export default Header;

@ -7,42 +7,41 @@
import SectionHeader from "../../Common/SectionHeader/SectionHeader";
import Form from "../../Common/Forms/Form";
import TextInputRow from "../../Common/Forms/TextInputRow";
import {UnitCommitmentScenario} from "../../../core/data";
import { UnitCommitmentScenario } from "../../../core/data";
interface ParametersProps {
scenario: UnitCommitmentScenario
scenario: UnitCommitmentScenario;
}
function Parameters({scenario}: ParametersProps) {
return (
<div>
<SectionHeader title="Parameters">
</SectionHeader>
<Form>
<TextInputRow
label="Time horizon"
unit="h"
tooltip="Length of the planning horizon (in hours)."
currentValue={`${scenario.Parameters["Time horizon (h)"]}`}
defaultValue="24"
/>
<TextInputRow
label="Time step"
unit="min"
tooltip="Length of each time step (in minutes). Must be a divisor of 60 (e.g. 60, 30, 20, 15, etc)."
currentValue={`${scenario.Parameters["Time step (min)"]}`}
defaultValue="60"
/>
<TextInputRow
label="Power balance penalty"
unit="$/MW"
tooltip="Penalty for system-wide shortage or surplus in production (in /MW). This is charged per time step. For example, if there is a shortage of 1 MW for three time steps, three times this amount will be charged."
currentValue={`${scenario.Parameters["Power balance penalty ($/MW)"]}`}
defaultValue="1000.0"
/>
</Form>
</div>
);
function Parameters({ scenario }: ParametersProps) {
return (
<div>
<SectionHeader title="Parameters"></SectionHeader>
<Form>
<TextInputRow
label="Time horizon"
unit="h"
tooltip="Length of the planning horizon (in hours)."
currentValue={`${scenario.Parameters["Time horizon (h)"]}`}
defaultValue="24"
/>
<TextInputRow
label="Time step"
unit="min"
tooltip="Length of each time step (in minutes). Must be a divisor of 60 (e.g. 60, 30, 20, 15, etc)."
currentValue={`${scenario.Parameters["Time step (min)"]}`}
defaultValue="60"
/>
<TextInputRow
label="Power balance penalty"
unit="$/MW"
tooltip="Penalty for system-wide shortage or surplus in production (in /MW). This is charged per time step. For example, if there is a shortage of 1 MW for three time steps, three times this amount will be charged."
currentValue={`${scenario.Parameters["Power balance penalty ($/MW)"]}`}
defaultValue="1000.0"
/>
</Form>
</div>
);
}
export default Parameters;

@ -4,39 +4,41 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import React, {Component} from "react";
import React, { Component } from "react";
class FileUploadElement extends Component<any> {
private inputRef = React.createRef<HTMLInputElement>();
private callback: (data: any) => void = () => {};
private inputRef = React.createRef<HTMLInputElement>();
private callback: (data: any) => void = () => {};
showFilePicker = (callback: (data: any) => void) => {
this.callback = callback;
this.inputRef.current?.click();
};
showFilePicker = (callback: (data: any) => void) => {
this.callback = callback;
this.inputRef.current?.click();
};
onFileSelected = (event: React.ChangeEvent<HTMLInputElement>) => {
const file = event.target.files![0];
if (file) {
const reader = new FileReader();
reader.onload = async (e) => {
this.callback(e.target?.result as string);
this.callback = () => {};
};
reader.readAsText(file);
}
event.target.value = '';
};
override render() {
return <input
ref={this.inputRef}
type="file"
accept={this.props.accept}
style={{ display: "none" }}
onChange={this.onFileSelected}
/>;
onFileSelected = (event: React.ChangeEvent<HTMLInputElement>) => {
const file = event.target.files![0];
if (file) {
const reader = new FileReader();
reader.onload = async (e) => {
this.callback(e.target?.result as string);
this.callback = () => {};
};
reader.readAsText(file);
}
event.target.value = "";
};
override render() {
return (
<input
ref={this.inputRef}
type="file"
accept={this.props.accept}
style={{ display: "none" }}
onChange={this.onFileSelected}
/>
);
}
}
export default FileUploadElement;

@ -5,39 +5,39 @@
*/
.tooltip {
visibility: hidden;
background-color: var(--contrast-80);
color: var(--contrast-10);
opacity: 0;
width: 250px;
margin-top: 36px;
margin-left: -250px;
position: absolute;
z-index: 100;
font-size: 14px;
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
line-height: 20px;
transition: opacity 0.5s;
font-weight: normal;
text-align: left;
padding: 6px 12px;
visibility: hidden;
background-color: var(--contrast-80);
color: var(--contrast-10);
opacity: 0;
width: 250px;
margin-top: 36px;
margin-left: -250px;
position: absolute;
z-index: 100;
font-size: 14px;
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
line-height: 20px;
transition: opacity 0.5s;
font-weight: normal;
text-align: left;
padding: 6px 12px;
}
.icon {
color: var(--contrast-60);
font-size: 16px;
padding: 8px 8px 8px 0;
color: var(--contrast-60);
font-size: 16px;
padding: 8px 8px 8px 0;
}
.HelpButton {
border: 0;
background-color: transparent;
cursor: pointer;
border: 0;
background-color: transparent;
cursor: pointer;
}
.HelpButton:hover .tooltip {
visibility: visible;
opacity: 100%;
transition: opacity 0.5s;
visibility: visible;
opacity: 100%;
transition: opacity 0.5s;
}

@ -5,19 +5,18 @@
*/
import styles from "./HelpButton.module.css";
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faCircleQuestion} from '@fortawesome/free-regular-svg-icons';
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faCircleQuestion } from "@fortawesome/free-regular-svg-icons";
function HelpButton({text}: { text: String }) {
return (
<button className={styles.HelpButton}>
<span className={styles.tooltip}>{text}</span>
<span className={styles.icon}>
<FontAwesomeIcon icon={faCircleQuestion}/>
</span>
</button>
);
function HelpButton({ text }: { text: String }) {
return (
<button className={styles.HelpButton}>
<span className={styles.tooltip}>{text}</span>
<span className={styles.icon}>
<FontAwesomeIcon icon={faCircleQuestion} />
</span>
</button>
);
}
export default HelpButton;

@ -5,22 +5,22 @@
*/
.SectionButton {
height: 48px;
width: 48px;
font-size: 16px;
border: 0;
background-color: transparent;
margin: 8px 0 8px 0px;
cursor: pointer;
color: var(--contrast-60);
height: 48px;
width: 48px;
font-size: 16px;
border: 0;
background-color: transparent;
margin: 8px 0 8px 0px;
cursor: pointer;
color: var(--contrast-60);
}
.SectionButton:hover {
color: var(--contrast-100);
background-color: var(--contrast-20);
border-radius: var(--border-radius);
color: var(--contrast-100);
background-color: var(--contrast-20);
border-radius: var(--border-radius);
}
.SectionButton:active {
background-color: var(--contrast-60);
background-color: var(--contrast-60);
}

@ -4,26 +4,26 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import {IconDefinition} from "@fortawesome/fontawesome-svg-core";
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import { IconDefinition } from "@fortawesome/fontawesome-svg-core";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import styles from "./SectionButton.module.css";
interface SectionButtonProps {
icon: IconDefinition,
tooltip: string,
onClick?: () => void,
icon: IconDefinition;
tooltip: string;
onClick?: () => void;
}
function SectionButton(props: SectionButtonProps) {
return (
<button
className={styles.SectionButton}
title={props.tooltip}
onClick={props.onClick}
>
<FontAwesomeIcon icon={props.icon}/>
</button>
);
return (
<button
className={styles.SectionButton}
title={props.tooltip}
onClick={props.onClick}
>
<FontAwesomeIcon icon={props.icon} />
</button>
);
}
export default SectionButton;

@ -5,24 +5,24 @@
*/
.SiteHeaderButton {
padding: 6px 36px;
margin: 0 0 0 8px;
line-height: 24px;
border: var(--box-border);
box-shadow: var(--box-shadow);
border-radius: var(--border-radius);
cursor: pointer;
color: var(--contrast-80);
text-transform: uppercase;
font-weight: bold;
font-size: 12px;
background: linear-gradient(var(--contrast-0) 25%, var(--contrast-10) 100%);
padding: 6px 36px;
margin: 0 0 0 8px;
line-height: 24px;
border: var(--box-border);
box-shadow: var(--box-shadow);
border-radius: var(--border-radius);
cursor: pointer;
color: var(--contrast-80);
text-transform: uppercase;
font-weight: bold;
font-size: 12px;
background: linear-gradient(var(--contrast-0) 25%, var(--contrast-10) 100%);
}
.SiteHeaderButton:hover {
background: rgb(245, 245, 245);
background: rgb(245, 245, 245);
}
.SiteHeaderButton:active {
background: rgba(220, 220, 220);
background: rgba(220, 220, 220);
}

@ -6,14 +6,18 @@
import styles from "./SiteHeaderButton.module.css";
function SiteHeaderButton({title, onClick}: { title: string, onClick?: () => void }) {
return (
<button
className={styles.SiteHeaderButton}
onClick={onClick}>
{title}
</button>
);
function SiteHeaderButton({
title,
onClick,
}: {
title: string;
onClick?: () => void;
}) {
return (
<button className={styles.SiteHeaderButton} onClick={onClick}>
{title}
</button>
);
}
export default SiteHeaderButton;

@ -5,38 +5,38 @@
*/
.Form {
background-color: var(--contrast-0);
border: var(--box-border);
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
min-height: 48px;
margin: 0 auto;
min-width: var(--site-min-width);
max-width: var(--site-max-width);
max-height: 500px;
padding: 12px 0;
background-color: var(--contrast-0);
border: var(--box-border);
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
min-height: 48px;
margin: 0 auto;
min-width: var(--site-min-width);
max-width: var(--site-max-width);
max-height: 500px;
padding: 12px 0;
}
.FormRow {
display: flex;
line-height: 24px;
display: flex;
line-height: 24px;
}
.FormRow label {
width: 350px;
padding: 6px 12px;
text-align: right;
width: 350px;
padding: 6px 12px;
text-align: right;
}
.FormRow input {
flex: 1;
font-family: monospace;
border: var(--box-border);
border-radius: var(--border-radius);
padding: 4px;
margin: 2px 3px;
flex: 1;
font-family: monospace;
border: var(--box-border);
border-radius: var(--border-radius);
padding: 4px;
margin: 2px 3px;
}
.FormRow_unit {
color: rgba(0, 0, 0, 0.4);
color: rgba(0, 0, 0, 0.4);
}

@ -4,11 +4,11 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import {ReactNode} from 'react';
import { ReactNode } from "react";
import styles from "./Form.module.css";
function Form({children}: { children: ReactNode }) {
return <div className={styles.Form}>{children}</div>;
function Form({ children }: { children: ReactNode }) {
return <div className={styles.Form}>{children}</div>;
}
export default Form;

@ -5,72 +5,72 @@
*/
.tabulator {
background-color: var(--contrast-0);
border: var(--box-border) !important;
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
min-height: 48px;
margin: 0 auto;
min-width: var(--site-min-width);
max-width: var(--site-max-width);
padding: 0;
background-color: var(--contrast-0);
border: var(--box-border) !important;
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
min-height: 48px;
margin: 0 auto;
min-width: var(--site-min-width);
max-width: var(--site-max-width);
padding: 0;
}
.tabulator .tabulator-header {
border-bottom: 1px solid #ccc;
font-size: 13px;
font-weight: bold;
color: var(--contrast-100);
line-height: 18px;
border-bottom: 1px solid #ccc;
font-size: 13px;
font-weight: bold;
color: var(--contrast-100);
line-height: 18px;
}
.tabulator .tabulator-header .subtitle {
color: var(--contrast-80);
font-weight: normal;
color: var(--contrast-80);
font-weight: normal;
}
.tabulator .tabulator-header .tabulator-col {
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
vertical-align: middle !important;
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
vertical-align: middle !important;
}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content {
padding: 6px 8px;
height: 48px;
padding: 6px 8px;
height: 48px;
}
.tabulator .tabulator-header .tabulator-col:last-child {
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
}
.tabulator-row .tabulator-cell {
font-family: monospace;
font-size: 12px;
line-height: 28px;
height: 28px;
text-align: right;
vertical-align: middle !important;
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
padding: 0 8px;
font-family: monospace;
font-size: 12px;
line-height: 28px;
height: 28px;
text-align: right;
vertical-align: middle !important;
border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
padding: 0 8px;
}
.tabulator-row-even {
background-color: rgba(0, 0, 0, 0.03) !important;
background-color: rgba(0, 0, 0, 0.03) !important;
}
.tabulator-row-odd {
background-color: rgba(0, 0, 0, 0) !important;
background-color: rgba(0, 0, 0, 0) !important;
}
.tabulator-row .tabulator-cell.tabulator-editing {
border: 0;
padding: 0 4px;
background-color: #cee;
border: 0;
padding: 0 4px;
background-color: #cee;
}
.tabulator-row .tabulator-cell.tabulator-editing input {
font-family: monospace;
text-align: right;
font-size: 12px;
font-family: monospace;
text-align: right;
font-size: 12px;
}

@ -7,27 +7,29 @@
import formStyles from "./Form.module.css";
import HelpButton from "../Buttons/HelpButton";
function TextInputRow({label, unit, tooltip, currentValue, defaultValue}: {
label: string,
unit: string,
tooltip: string,
currentValue: string,
defaultValue: string,
function TextInputRow({
label,
unit,
tooltip,
currentValue,
defaultValue,
}: {
label: string;
unit: string;
tooltip: string;
currentValue: string;
defaultValue: string;
}) {
return (
<div className={formStyles.FormRow}>
<label>
{label}
<span className={formStyles.FormRow_unit}> ({unit})</span>
</label>
<input
type="text"
placeholder={defaultValue}
value={currentValue}
/>
<HelpButton text={tooltip}/>
</div>
);
return (
<div className={formStyles.FormRow}>
<label>
{label}
<span className={formStyles.FormRow_unit}> ({unit})</span>
</label>
<input type="text" placeholder={defaultValue} value={currentValue} />
<HelpButton text={tooltip} />
</div>
);
}
export default TextInputRow;

@ -5,20 +5,20 @@
*/
.SectionHeader {
max-width: var(--site-max-width);
min-width: var(--site-min-width);
margin: 0 auto;
color: var(--contrast-100);
max-width: var(--site-max-width);
min-width: var(--site-min-width);
margin: 0 auto;
color: var(--contrast-100);
}
.SectionHeader h1 {
margin: 0;
padding: 0 12px;
font-size: 16px;
line-height: 64px;
margin: 0;
padding: 0 12px;
font-size: 16px;
line-height: 64px;
}
.SectionButtonsContainer {
float: right;
height: 64px;
float: right;
height: 64px;
}

@ -5,23 +5,20 @@
*/
import styles from "./SectionHeader.module.css";
import {ReactNode} from "react";
import { ReactNode } from "react";
interface SectionHeaderProps {
title: string,
children: ReactNode
title: string;
children?: ReactNode;
}
function SectionHeader({title, children}: SectionHeaderProps) {
return (
<div className={styles.SectionHeader}>
<div className={styles.SectionButtonsContainer}>
{children}
</div>
<h1>{title}</h1>
</div>
);
function SectionHeader({ title, children }: SectionHeaderProps) {
return (
<div className={styles.SectionHeader}>
<div className={styles.SectionButtonsContainer}>{children}</div>
<h1>{title}</h1>
</div>
);
}
export default SectionHeader;

@ -5,13 +5,13 @@
*/
export function offerDownload(data: string, type: string, filename: string) {
const dataBlob = new Blob([data], {type: type});
const url = URL.createObjectURL(dataBlob);
const link = document.createElement('a');
link.href = url;
link.download = filename;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
const dataBlob = new Blob([data], { type: type });
const url = URL.createObjectURL(dataBlob);
const link = document.createElement("a");
link.href = url;
link.download = filename;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}

@ -5,362 +5,358 @@
*/
export const schema = {
$schema: "http://json-schema.org/draft-07/schema#",
title: "Schema for Unit Commitment Input File",
definitions: {
Parameters: {
type: "object",
properties: {
"Version": {
type: "string",
const: "0.4",
description: "Version of UnitCommitment.jl"
},
"Time horizon (min)": {
type: "number",
exclusiveMinimum: 0,
description: "Length of the planning horizon in minutes"
},
"Time horizon (h)": {
type: "number",
exclusiveMinimum: 0,
description: "Length of the planning horizon in hours"
},
"Time step (min)": {
type: "number",
default: 60,
enum: [60, 30, 20, 15, 12, 10, 6, 5, 4, 3, 2, 1],
description: "Must be a divisor of 60"
},
"Power balance penalty ($/MW)": {
type: "number",
default: 1000.0,
minimum: 0,
description: "Penalty for system-wide shortage or surplus"
},
"Scenario name": {
type: "string",
default: "s1",
description: "Name of the scenario"
},
"Scenario weight": {
type: "number",
default: 1.0,
exclusiveMinimum: 0,
description: "Weight of the scenario"
}
},
required: ["Time step (min)", "Power balance penalty ($/MW)"],
oneOf: [
{ required: ["Time horizon (min)"] },
{ required: ["Time horizon (h)"] }
],
not: {
required: ["Time horizon (min)", "Time horizon (h)"]
}
$schema: "http://json-schema.org/draft-07/schema#",
title: "Schema for Unit Commitment Input File",
definitions: {
Parameters: {
type: "object",
properties: {
Version: {
type: "string",
const: "0.4",
description: "Version of UnitCommitment.jl",
},
Bus: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Load (MW)": {
oneOf: [
{ type: "null" },
{ type: "number" },
{
type: "array",
items: {
oneOf: [
{ type: "number" },
{ type: "null" }
]
}
}
]
}
}
},
"Time horizon (min)": {
type: "number",
exclusiveMinimum: 0,
description: "Length of the planning horizon in minutes",
},
TransmissionLines: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Source bus": {
type: "string",
minLength: 1,
},
"Target bus": {
type: "string",
minLength: 1,
not: {
const: { $data: "1/Source bus" }
}
},
"Susceptance (S)": {
type: "number",
minimum: 0
},
"Normal flow limit (MW)": {
type: "number",
minimum: 0
},
"Emergency flow limit (MW)": {
type: "number",
minimum: 0
},
"Flow limit penalty ($/MW)": {
type: "number",
minimum: 0,
default: 5000.0
}
},
required: ["Source bus", "Target bus", "Susceptance (S)"]
}
"Time horizon (h)": {
type: "number",
exclusiveMinimum: 0,
description: "Length of the planning horizon in hours",
},
StorageUnits: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Bus": {
type: "string",
minLength: 1,
},
"Minimum level (MWh)": {
type: "number",
},
"Maximum level (MWh)": {
type: "number",
minimum: 0
},
"Allow simultaneous charging and discharging": {
type: "boolean",
default: true
},
"Charge cost ($/MW)": {
type: "number",
minimum: 0
},
"Discharge cost ($/MW)": {
type: "number",
minimum: 0
},
"Charge efficiency": {
type: "number",
minimum: 0,
maximum: 1
},
"Discharge efficiency": {
type: "number",
minimum: 0,
maximum: 1
},
"Loss factor": {
type: "number",
minimum: 0
},
"Minimum charge rate (MW)": {
type: "number",
minimum: 0
},
"Maximum charge rate (MW)": {
type: "number",
minimum: 0
},
"Minimum discharge rate (MW)": {
type: "number",
minimum: 0
},
"Maximum discharge rate (MW)": {
type: "number",
minimum: 0
},
"Initial level (MWh)": {
type: "number",
minimum: 0
},
"Last period minimum level (MWh)": {
type: "number",
minimum: 0
},
"Last period maximum level (MWh)": {
type: "number",
minimum: 0
}
},
required: ["Bus"]
}
"Time step (min)": {
type: "number",
default: 60,
enum: [60, 30, 20, 15, 12, 10, 6, 5, 4, 3, 2, 1],
description: "Must be a divisor of 60",
},
Generators: {
type: "object",
additionalProperties: {
type: "object",
if: {
properties: {
"Type": { const: "Thermal" }
}
},
then: {
properties: {
"Bus": {
type: "string",
minLength: 1,
},
"Type": {
type: "string",
const: "Thermal"
},
"Production cost curve (MW)": {
type: "array",
items: {
type: "number",
minimum: 0
},
minItems: 1
},
"Production cost curve ($)": {
type: "array",
items: {
type: "number",
minimum: 0
},
minItems: 1
},
"Startup costs ($)": {
type: "array",
items: {
type: "number",
minimum: 0
},
default: [0.0]
},
"Startup delays (h)": {
type: "array",
items: {
type: "integer",
minimum: 1
},
default: [1]
},
"Minimum uptime (h)": {
type: "integer",
default: 1,
minimum: 0
},
"Minimum downtime (h)": {
type: "integer",
default: 1,
minimum: 0
},
"Ramp up limit (MW)": {
type: "number",
minimum: 0
},
"Ramp down limit (MW)": {
type: "number",
minimum: 0
},
"Startup limit (MW)": {
type: "number",
minimum: 0
},
"Shutdown limit (MW)": {
type: "number",
minimum: 0
},
"Initial status (h)": {
type: "integer",
default: 1,
not: { const: 0 }
},
"Initial power (MW)": {
type: "number",
minimum: 0
},
"Must run?": {
type: "boolean",
default: false
}
},
required: [
"Bus",
"Type",
"Production cost curve (MW)",
"Production cost curve ($)",
"Initial status (h)",
"Initial power (MW)"
]
},
else: {
properties: {
"Type": { const: "Profiled" },
"Bus": {
type: "string",
minLength: 1,
},
"Maximum power (MW)": {
oneOf: [
{
type: "number",
},
{
type: "array",
items: {
type: "number",
}
}
]
},
"Cost ($/MW)": {
type: "number",
minimum: 0
}
},
required: ["Type", "Bus", "Maximum power (MW)", "Cost ($/MW)"]
}
}
"Power balance penalty ($/MW)": {
type: "number",
default: 1000.0,
minimum: 0,
description: "Penalty for system-wide shortage or surplus",
},
"Scenario name": {
type: "string",
default: "s1",
description: "Name of the scenario",
},
Contingencies: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Affected lines": {
type: "array",
items: {
type: "string"
},
maxItems: 1,
minItems: 1
}
"Scenario weight": {
type: "number",
default: 1.0,
exclusiveMinimum: 0,
description: "Weight of the scenario",
},
},
required: ["Time step (min)", "Power balance penalty ($/MW)"],
oneOf: [
{ required: ["Time horizon (min)"] },
{ required: ["Time horizon (h)"] },
],
not: {
required: ["Time horizon (min)", "Time horizon (h)"],
},
},
Bus: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Load (MW)": {
oneOf: [
{ type: "null" },
{ type: "number" },
{
type: "array",
items: {
oneOf: [{ type: "number" }, { type: "null" }],
},
required: ["Affected lines"]
}
}
},
],
},
},
},
},
type: "object",
properties: {
Parameters: {
$ref: "#/definitions/Parameters"
TransmissionLines: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Source bus": {
type: "string",
minLength: 1,
},
"Target bus": {
type: "string",
minLength: 1,
not: {
const: { $data: "1/Source bus" },
},
},
"Susceptance (S)": {
type: "number",
minimum: 0,
},
"Normal flow limit (MW)": {
type: "number",
minimum: 0,
},
"Emergency flow limit (MW)": {
type: "number",
minimum: 0,
},
"Flow limit penalty ($/MW)": {
type: "number",
minimum: 0,
default: 5000.0,
},
},
Buses: {
$ref: "#/definitions/Bus"
required: ["Source bus", "Target bus", "Susceptance (S)"],
},
},
StorageUnits: {
type: "object",
additionalProperties: {
type: "object",
properties: {
Bus: {
type: "string",
minLength: 1,
},
"Minimum level (MWh)": {
type: "number",
},
"Maximum level (MWh)": {
type: "number",
minimum: 0,
},
"Allow simultaneous charging and discharging": {
type: "boolean",
default: true,
},
"Charge cost ($/MW)": {
type: "number",
minimum: 0,
},
"Discharge cost ($/MW)": {
type: "number",
minimum: 0,
},
"Charge efficiency": {
type: "number",
minimum: 0,
maximum: 1,
},
"Discharge efficiency": {
type: "number",
minimum: 0,
maximum: 1,
},
"Loss factor": {
type: "number",
minimum: 0,
},
"Minimum charge rate (MW)": {
type: "number",
minimum: 0,
},
"Maximum charge rate (MW)": {
type: "number",
minimum: 0,
},
"Minimum discharge rate (MW)": {
type: "number",
minimum: 0,
},
"Maximum discharge rate (MW)": {
type: "number",
minimum: 0,
},
"Initial level (MWh)": {
type: "number",
minimum: 0,
},
"Last period minimum level (MWh)": {
type: "number",
minimum: 0,
},
"Last period maximum level (MWh)": {
type: "number",
minimum: 0,
},
},
"Transmission lines": {
$ref: "#/definitions/TransmissionLines"
required: ["Bus"],
},
},
Generators: {
type: "object",
additionalProperties: {
type: "object",
if: {
properties: {
Type: { const: "Thermal" },
},
},
"Storage units": {
$ref: "#/definitions/StorageUnits"
then: {
properties: {
Bus: {
type: "string",
minLength: 1,
},
Type: {
type: "string",
const: "Thermal",
},
"Production cost curve (MW)": {
type: "array",
items: {
type: "number",
minimum: 0,
},
minItems: 1,
},
"Production cost curve ($)": {
type: "array",
items: {
type: "number",
minimum: 0,
},
minItems: 1,
},
"Startup costs ($)": {
type: "array",
items: {
type: "number",
minimum: 0,
},
default: [0.0],
},
"Startup delays (h)": {
type: "array",
items: {
type: "integer",
minimum: 1,
},
default: [1],
},
"Minimum uptime (h)": {
type: "integer",
default: 1,
minimum: 0,
},
"Minimum downtime (h)": {
type: "integer",
default: 1,
minimum: 0,
},
"Ramp up limit (MW)": {
type: "number",
minimum: 0,
},
"Ramp down limit (MW)": {
type: "number",
minimum: 0,
},
"Startup limit (MW)": {
type: "number",
minimum: 0,
},
"Shutdown limit (MW)": {
type: "number",
minimum: 0,
},
"Initial status (h)": {
type: "integer",
default: 1,
not: { const: 0 },
},
"Initial power (MW)": {
type: "number",
minimum: 0,
},
"Must run?": {
type: "boolean",
default: false,
},
},
required: [
"Bus",
"Type",
"Production cost curve (MW)",
"Production cost curve ($)",
"Initial status (h)",
"Initial power (MW)",
],
},
"Generators": {
$ref: "#/definitions/Generators"
else: {
properties: {
Type: { const: "Profiled" },
Bus: {
type: "string",
minLength: 1,
},
"Maximum power (MW)": {
oneOf: [
{
type: "number",
},
{
type: "array",
items: {
type: "number",
},
},
],
},
"Cost ($/MW)": {
type: "number",
minimum: 0,
},
},
required: ["Type", "Bus", "Maximum power (MW)", "Cost ($/MW)"],
},
"Contingencies": {
$ref: "#/definitions/Contingencies"
}
},
},
Contingencies: {
type: "object",
additionalProperties: {
type: "object",
properties: {
"Affected lines": {
type: "array",
items: {
type: "string",
},
maxItems: 1,
minItems: 1,
},
},
required: ["Affected lines"],
},
},
},
type: "object",
properties: {
Parameters: {
$ref: "#/definitions/Parameters",
},
Buses: {
$ref: "#/definitions/Bus",
},
"Transmission lines": {
$ref: "#/definitions/TransmissionLines",
},
"Storage units": {
$ref: "#/definitions/StorageUnits",
},
Generators: {
$ref: "#/definitions/Generators",
},
Contingencies: {
$ref: "#/definitions/Contingencies",
},
required: ["Parameters"],
},
required: ["Parameters"],
};

@ -4,14 +4,18 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import { schema } from './schema';
import { schema } from "./schema";
import Ajv from "ajv";
// Create Ajv instance with detailed debug options
const ajv = new Ajv({
verbose: true,
allErrors: true,
$data: true,
verbose: true,
allErrors: true,
$data: true,
});
export interface ValidationError {
message: string;
}
export const validate = ajv.compile(schema);

@ -5,196 +5,76 @@
*/
export interface Buses {
[busName: string]: { "Load (MW)": number[] };
[busName: string]: { "Load (MW)": number[] };
}
export interface UnitCommitmentScenario {
Parameters: {
Version: string,
"Power balance penalty ($/MW)": number,
"Time horizon (h)": number,
"Time step (min)": number,
},
Buses: Buses
Parameters: {
Version: string;
"Power balance penalty ($/MW)": number;
"Time horizon (h)": number;
"Time step (min)": number;
};
Buses: Buses;
}
export const BLANK_SCENARIO: UnitCommitmentScenario = {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 24,
"Time step (min)": 60,
},
"Buses": {}
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 24,
"Time step (min)": 60,
},
Buses: {},
};
export const TEST_SCENARIO: UnitCommitmentScenario = {
"Parameters": {
"Version": "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 36,
"Time step (min)": 60,
Parameters: {
Version: "0.4",
"Power balance penalty ($/MW)": 1000.0,
"Time horizon (h)": 36,
"Time step (min)": 60,
},
Buses: {
b1: {
"Load (MW)": [
35.79534, 34.38835, 33.45083, 32.89729, 33.25044, 33.93851, 35.8654,
37.27098, 38.08378, 38.99327, 38.65134, 38.83212, 37.60031, 37.27939,
37.11823, 37.73063, 40.951, 44.77115, 43.67527, 44.40959, 44.33812,
42.29071, 40.07654, 37.42093, 35.61175, 34.28185, 32.74174, 33.17336,
33.5181, 35.63558, 38.12722, 39.61689, 40.80105, 42.55277, 42.76017,
42.12535,
],
},
b2: {
"Load (MW)": [
14.03739, 13.48563, 13.11797, 12.9009, 13.03939, 13.30922, 14.06486,
14.61607, 14.93482, 15.29148, 15.15739, 15.22828, 14.74522, 14.61937,
14.55617, 14.79633, 16.05921, 17.55731, 17.12756, 17.41553, 17.3875,
16.58459, 15.71629, 14.67487, 13.96539, 13.44386, 12.8399, 13.00916,
13.14435, 13.97474, 14.95185, 15.53603, 16.00041, 16.68736, 16.76869,
16.51974,
],
},
b3: {
"Load (MW)": [
27.3729, 26.29698, 25.58005, 25.15675, 25.4268, 25.95298, 27.42649,
28.50134, 29.12289, 29.81839, 29.55691, 29.69515, 28.75318, 28.50777,
28.38453, 28.85284, 31.31547, 34.23676, 33.39874, 33.96028, 33.90562,
32.33996, 30.64676, 28.61601, 27.23252, 26.21553, 25.0378, 25.36786,
25.63149, 27.25074, 29.15611, 30.29527, 31.2008, 32.54035, 32.69895,
32.2135,
],
},
b4: {
"Load (MW)": [
27.3729, 26.29698, 25.58005, 25.15675, 25.4268, 25.95298, 27.42649,
28.50134, 29.12289, 29.81839, 29.55691, 29.69515, 28.75318, 28.50777,
28.38453, 28.85284, 31.31547, 34.23676, 33.39874, 33.96028, 33.90562,
32.33996, 30.64676, 28.61601, 27.23252, 26.21553, 25.0378, 25.36786,
25.63149, 27.25074, 29.15611, 30.29527, 31.2008, 32.54035, 32.69895,
32.2135,
],
},
"Buses": {
"b1": {
"Load (MW)": [
35.79534,
34.38835,
33.45083,
32.89729,
33.25044,
33.93851,
35.8654,
37.27098,
38.08378,
38.99327,
38.65134,
38.83212,
37.60031,
37.27939,
37.11823,
37.73063,
40.951,
44.77115,
43.67527,
44.40959,
44.33812,
42.29071,
40.07654,
37.42093,
35.61175,
34.28185,
32.74174,
33.17336,
33.5181,
35.63558,
38.12722,
39.61689,
40.80105,
42.55277,
42.76017,
42.12535
]
},
"b2": {
"Load (MW)": [
14.03739,
13.48563,
13.11797,
12.9009,
13.03939,
13.30922,
14.06486,
14.61607,
14.93482,
15.29148,
15.15739,
15.22828,
14.74522,
14.61937,
14.55617,
14.79633,
16.05921,
17.55731,
17.12756,
17.41553,
17.3875,
16.58459,
15.71629,
14.67487,
13.96539,
13.44386,
12.8399,
13.00916,
13.14435,
13.97474,
14.95185,
15.53603,
16.00041,
16.68736,
16.76869,
16.51974
]
},
"b3": {
"Load (MW)": [
27.3729,
26.29698,
25.58005,
25.15675,
25.4268,
25.95298,
27.42649,
28.50134,
29.12289,
29.81839,
29.55691,
29.69515,
28.75318,
28.50777,
28.38453,
28.85284,
31.31547,
34.23676,
33.39874,
33.96028,
33.90562,
32.33996,
30.64676,
28.61601,
27.23252,
26.21553,
25.0378,
25.36786,
25.63149,
27.25074,
29.15611,
30.29527,
31.2008,
32.54035,
32.69895,
32.2135
]
},
"b4": {
"Load (MW)": [
27.3729,
26.29698,
25.58005,
25.15675,
25.4268,
25.95298,
27.42649,
28.50134,
29.12289,
29.81839,
29.55691,
29.69515,
28.75318,
28.50777,
28.38453,
28.85284,
31.31547,
34.23676,
33.39874,
33.96028,
33.90562,
32.33996,
30.64676,
28.61601,
27.23252,
26.21553,
25.0378,
25.36786,
25.63149,
27.25074,
29.15611,
30.29527,
31.2008,
32.54035,
32.69895,
32.2135
]
},
}
},
};

@ -4,19 +4,19 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import React from 'react';
import ReactDOM from 'react-dom/client';
import reportWebVitals from './reportWebVitals';
import React from "react";
import ReactDOM from "react-dom/client";
import reportWebVitals from "./reportWebVitals";
import CaseBuilder from "./components/CaseBuilder/CaseBuilder";
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
document.getElementById("root") as HTMLElement,
);
root.render(
<React.StrictMode>
<CaseBuilder/>
</React.StrictMode>
<React.StrictMode>
<CaseBuilder />
</React.StrictMode>,
);
reportWebVitals();

@ -4,18 +4,18 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import {ReportHandler} from 'web-vitals';
import { ReportHandler } from "web-vitals";
const reportWebVitals = (onPerfEntry?: ReportHandler) => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({getCLS, getFID, getFCP, getLCP, getTTFB}) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
if (onPerfEntry && onPerfEntry instanceof Function) {
import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

@ -4,4 +4,4 @@
* Released under the modified BSD license. See COPYING.md for more details.
*/
import '@testing-library/jest-dom';
import "@testing-library/jest-dom";

@ -1,11 +1,7 @@
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": false,
"allowSyntheticDefaultImports": true,
"alwaysStrict": true,
@ -35,7 +31,5 @@
"noUnusedParameters": false,
"checkJs": true
},
"include": [
"src"
]
"include": ["src"]
}

Loading…
Cancel
Save