Added real data pull from db

This commit is contained in:
Khalim Conn-Kowlessar 2024-04-16 00:30:20 +01:00
parent 8963d0661a
commit 0f83b2a743
3 changed files with 179 additions and 104 deletions

View file

@ -6,7 +6,6 @@ import {
flexRender,
getCoreRowModel,
ColumnDef,
CellContext,
} from "@tanstack/react-table";
import {
Table,
@ -19,21 +18,6 @@ import {
import SelectComparisonModal from "./SelectComparisonModal";
import EpcBarChart from "./EpcBarChart";
interface ChartData {
name: string;
[key: string]: number | string; // Allows for any number of properties with numeric values, plus the name
}
interface Scenario {
scenarioName: string; // E.g., "today", "baseline", or dynamically named scenarios
data: ChartData[] | string; // This could be an array of chart data or a simple string if applicable
}
export interface DataItem {
title: string;
scenarios: Scenario[];
}
const SummaryTable = ({
portfolioName,
data,

View file

@ -1,7 +1,5 @@
import SummaryTable, {
DataItem,
} from "@/app/components/portfolio/summary/SummaryTable";
import { getPortfolio, getUserPortfolios } from "../../utils";
import SummaryTable from "@/app/components/portfolio/summary/SummaryTable";
import { getUserPortfolios, getOverviewPortfolioData } from "../../utils";
export default async function PortfolioSummary({
params,
@ -9,94 +7,12 @@ export default async function PortfolioSummary({
params: { slug: string };
}) {
const portfolioId = params.slug;
const { name: portfolioName } = await getPortfolio(portfolioId);
const { portfolioName, data } = await getOverviewPortfolioData(portfolioId);
// Retrieve all of the names and ids of the portfolios, attributed to this user
// Get user id from the session
const userPortfolios = await getUserPortfolios(portfolioId);
// Dummy data for rows
const data: DataItem[] = [
{
title: "EPCs",
scenarios: [
{
scenarioName: "Today",
data: [
{ name: "G", G: 2488 },
{ name: "F", F: 1445 },
{ name: "E", E: 743 },
{ name: "D", D: 281 },
{ name: "C", C: 251 },
{ name: "B", B: 0 },
{ name: "A", A: 0 },
],
},
{
scenarioName: "Projected",
data: [
{ name: "G", G: 0 },
{ name: "F", F: 0 },
{ name: "E", E: 0 },
{ name: "D", D: 0 },
{ name: "C", C: 5000 },
{ name: "B", B: 0 },
{ name: "A", A: 0 },
],
},
],
},
{
title: "# Units",
scenarios: [
{ scenarioName: "Today", data: "5000" },
{ scenarioName: "Projected", data: "" },
],
},
{
title: "Co2/unit",
scenarios: [
{ scenarioName: "Today", data: "100t" },
{ scenarioName: "Projected", data: "50t" },
],
},
{
title: "Energy bills/unit",
scenarios: [
{ scenarioName: "Today", data: "£2000" },
{ scenarioName: "Projected", data: "£1,500" },
],
},
{
title: "Cost (£)",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: "Projected", data: "£32,412" },
],
},
{
title: "Cost (£) /unit",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: "Projected", data: "£32,412" },
],
},
{
title: "£ per CO2 reduction",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: "Projected", data: "£50" },
],
},
{
title: "£ per SAP point",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: "Projected", data: "£30" },
],
},
];
return (
<div className="container mx-auto px-4">
<h1 className="text-3xl text-gray-700 font-bold my-4">Overview</h1>

View file

@ -29,6 +29,181 @@ export async function getPortfolio(portfolioId: string): Promise<Portfolio> {
return data[0];
}
// Types needed for the overview page
interface ChartData {
name: string;
[key: string]: number | string; // Allows for any number of properties with numeric values, plus the name
}
interface Scenario {
scenarioName: string; // E.g., "today", "baseline", or dynamically named scenarios
data: ChartData[] | string; // This could be an array of chart data or a simple string if applicable
}
export interface DataItem {
title: string;
scenarios: Scenario[];
}
export async function getOverviewPortfolioData(
portfolioId: string
): Promise<{ portfolioName: string; data: DataItem[] }> {
// Keep just the columns we need for the overview
const data = await db
.select({
name: portfolio.name,
cost: portfolio.cost,
epcBreakdownPreRetrofit: portfolio.epcBreakdownPreRetrofit,
epcBreakdownPostRetrofit: portfolio.epcBreakdownPostRetrofit,
numberOfProperties: portfolio.numberOfProperties,
nUnitsToRetrofit: portfolio.nUnitsToRetrofit,
co2PerUnitPreRetrofit: portfolio.co2PerUnitPreRetrofit,
co2PerUnitPostRetrofit: portfolio.co2PerUnitPostRetrofit,
energyBillPerUnitPreRetrofit: portfolio.energyBillPerUnitPreRetrofit,
energyBillPerUnitPostRetrofit: portfolio.energyBillPerUnitPostRetrofit,
energyConsumptionPerUnitPreRetrofit:
portfolio.energyConsumptionPerUnitPreRetrofit,
energyConsumptionPerUnitPostRetrofit:
portfolio.energyConsumptionPerUnitPostRetrofit,
valuationImprovementPerUnit: portfolio.valuationImprovementPerUnit,
costPerUnit: portfolio.costPerUnit,
costPerCo2Saved: portfolio.costPerCo2Saved,
costPerSapPoint: portfolio.costPerSapPoint,
valuationReturnOnInvestment: portfolio.valuationReturnOnInvestment,
})
.from(portfolio)
.where(eq(portfolio.id, BigInt(portfolioId)));
if (data.length === 0) {
throw new Error("Portfolio not found");
}
if (data.length > 1) {
throw new Error("More than one portfolio found");
}
const portfolioName = data[0].name;
// Format the data we need for the overview
const output = [
{
title: "EPCs",
scenarios: [
{
scenarioName: "Today",
data: JSON.parse(
data[0].epcBreakdownPreRetrofit || "[]"
) as ChartData[],
},
{
scenarioName: portfolioName,
data: JSON.parse(
data[0].epcBreakdownPostRetrofit || "[]"
) as ChartData[],
},
],
},
{
title: "# Units",
scenarios: [
{ scenarioName: "Today", data: data[0].numberOfProperties },
{ scenarioName: portfolioName, data: "" },
],
},
{
title: "# Units to retrofit",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: portfolioName, data: data[0].nUnitsToRetrofit },
],
},
{
title: "Co2/unit",
scenarios: [
{ scenarioName: "Today", data: data[0].co2PerUnitPreRetrofit },
{ scenarioName: portfolioName, data: data[0].co2PerUnitPostRetrofit },
],
},
{
title: "Energy bills/unit",
scenarios: [
{ scenarioName: "Today", data: data[0].energyBillPerUnitPreRetrofit },
{
scenarioName: portfolioName,
data: data[0].energyBillPerUnitPostRetrofit,
},
],
},
{
title: "Energy consumption (kWh)/unit",
scenarios: [
{
scenarioName: "Today",
data: data[0].energyConsumptionPerUnitPreRetrofit,
},
{
scenarioName: portfolioName,
data: data[0].energyConsumptionPerUnitPostRetrofit,
},
],
},
{
title: "Cost (£)",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: portfolioName, data: data[0].cost },
],
},
{
title: "Cost (£) /unit",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: portfolioName, data: data[0].costPerUnit },
],
},
{
title: "£ per CO2 reduction",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: portfolioName, data: data[0].costPerCo2Saved },
],
},
{
title: "£ per SAP point",
scenarios: [
{ scenarioName: "Today", data: "" },
{ scenarioName: portfolioName, data: data[0].costPerSapPoint },
],
},
{
title: "Valuation improvement per unit",
scenarios: [
{ scenarioName: "Today", data: "" },
{
scenarioName: portfolioName,
data: data[0].valuationImprovementPerUnit,
},
],
},
{
title: "Valuation return on investment",
scenarios: [
{ scenarioName: "Today", data: "" },
{
scenarioName: portfolioName,
data: data[0].valuationReturnOnInvestment,
},
],
},
] as DataItem[];
return {
portfolioName: portfolioName,
data: output,
};
}
export async function getUserPortfolios(
portfolioId: string
): Promise<{ id: bigint; name: string }[]> {