@@ -60,6 +64,12 @@ const statusColor: {
hoverText: "This portfolio is currently in the assessment stage",
propertyHoverText: "This property is currently in the assessment stage",
},
+ survey: {
+ class: "bg-brandblue hover:bg-hoverblue",
+ text: "survey",
+ hoverText: "This portfolio is currently in the survey stage",
+ propertyHoverText: "This property is currently in the survey stage",
+ },
tendering: {
class: "bg-emerald-500 hover:bg-emerald-500",
text: "tendering",
diff --git a/src/app/components/building-passport/EnergyEfficiencyImpactCard.tsx b/src/app/components/building-passport/EnergyEfficiencyImpactCard.tsx
index 1f9c2075..1ff4ff00 100644
--- a/src/app/components/building-passport/EnergyEfficiencyImpactCard.tsx
+++ b/src/app/components/building-passport/EnergyEfficiencyImpactCard.tsx
@@ -52,13 +52,13 @@ export function EnergyEfficiencyImpactCard({
interface SecondaryEnergyEfficiencyImpactCardProps {
TotalCo2Savings: number;
totalEnergyCostSavings: number;
- totalHeatDemandSavings: number;
+ totalKwhSavings: number;
}
export function SecondaryEnergyEfficiencyImpactCard({
TotalCo2Savings,
totalEnergyCostSavings,
- totalHeatDemandSavings,
+ totalKwhSavings,
}: SecondaryEnergyEfficiencyImpactCardProps) {
return (
@@ -77,9 +77,7 @@ export function SecondaryEnergyEfficiencyImpactCard({
Energy Savings
-
- {totalHeatDemandSavings.toFixed(0) + "kWh"}
-
+ {totalKwhSavings.toFixed(0) + "kWh"}
diff --git a/src/app/components/building-passport/EpcCard.tsx b/src/app/components/building-passport/EpcCard.tsx
index 8b9ca1fe..7f4df5c9 100644
--- a/src/app/components/building-passport/EpcCard.tsx
+++ b/src/app/components/building-passport/EpcCard.tsx
@@ -6,12 +6,14 @@ export default function EpcCard({
expected = false,
kwh = null,
carbon = null,
+ sap = null,
}: {
epcRating: string;
fullMargin: boolean;
expected?: boolean;
kwh?: number | null;
carbon?: number | null;
+ sap?: string | null;
}) {
let marginClass = "";
if (fullMargin) {
@@ -30,28 +32,35 @@ export default function EpcCard({
return (
{kwh && (
{title}
- {epcRating}
+
+ {/* EPC Rating and SAP Rating */}
+
+ {/* EPC Rating */}
+
{(kwh || carbon) && (
{epcRating}
+
+ {/* SAP Rating (only if sap is provided) */}
+ {sap !== null && (
+ {sap}
+ )}
+ | {kwh.toFixed(0)} kWh | |
| - {carbon}t CO 2 + {carbon}t CO2 |
| Total Budget | +{budgetFormatted} | +
| Total Cost | ++ {totalCostFormatted} + | +
| Total properties | +{numProperties} | +
+
+
+
+
+ + Environmental Impact +
+| + Annual{" "} + + CO2 + {" "} + Savings + | ++ {co2EquivalentSavingsFormatted} + | +
| Annual Energy Savings | ++ {energySavingsFormatted} + | +
+
+
+
+
+ + Financial Impact +
+| Annual Energy Bill Reduction | ++ {energyCostSavingsFormatted} + | +
| Total Value Increase | ++ {totalValueIncreaseFormatted} + | +
+
+ {
+ setSelectedScenarioId(id);
+ }}
+ />
+
+
+ );
+};
+
+export default SummaryTable;
diff --git a/src/app/components/signin/CredentialsButton.tsx b/src/app/components/signin/CredentialsButton.tsx
new file mode 100644
index 00000000..0104c682
--- /dev/null
+++ b/src/app/components/signin/CredentialsButton.tsx
@@ -0,0 +1,71 @@
+"use client";
+
+import { signIn } from "next-auth/react";
+import { useState, useEffect, SetStateAction } from "react";
+import { Input } from "@/app/shadcn_components/ui/input";
+import { Button } from "@/app/shadcn_components/ui/button";
+import { ChevronRightIcon } from "@heroicons/react/20/solid";
+
+export default function EmailSignInButton({
+ error: initialError,
+}: {
+ error: string | undefined;
+}) {
+ const [email, setEmail] = useState("");
+ const [error, setError] = useState(initialError);
+
+ const handleSubmit = async (e: { preventDefault: () => void }) => {
+ e.preventDefault();
+ const res = await signIn("credentials", {
+ email,
+ });
+
+ if (res?.error) {
+ setError("You are not a valid user.");
+ } else {
+ console.log("Login successful");
+ }
+ };
+
+ const handleEmailChange = (e: {
+ target: { value: SetStateAction
+
+
+
+
{/* Left Half */}
@@ -22,7 +31,7 @@ export default async function Home() {
{/* Right Half */}
-
diff --git a/src/app/portfolio/[slug]/(portfolio)/page.tsx b/src/app/portfolio/[slug]/(portfolio)/page.tsx
index 11ed2404..748ca2e0 100644
--- a/src/app/portfolio/[slug]/(portfolio)/page.tsx
+++ b/src/app/portfolio/[slug]/(portfolio)/page.tsx
@@ -1,9 +1,11 @@
import { HomeIcon } from "@heroicons/react/24/outline";
-import { getPortfolio, getProperties } from "../utils";
+import { getPortfolio, getPortfolioPerformance, getProperties } from "../utils";
import DataTable from "@/app/portfolio/[slug]/components/propertyTable";
import { columns } from "@/app/portfolio/[slug]/components/propertyTableColumns";
import { PropertyWithRelations } from "@/app/db/schema/property";
import { formatNumber, convertDaysToWorkingWeeks } from "@/app/utils";
+import SummaryBox from "@/app/components/portfolio/SummaryBox";
+import { is } from "cypress/types/bluebird";
// We enfore caching of data for 60 seconds
export const revalidate = 60;
@@ -22,177 +24,6 @@ function EmptyPropertyState() {
);
}
-interface SummaryBoxProps {
- budget: number | null;
- totalCost: number | null;
- numProperties: number;
- co2EquivalentSavings: number | null;
- totalWorkHours: number | null;
- propertyValuationIncrease: number | null;
- rentalYieldIncrease: number | null;
- energySavings: number | null;
- energyCostSavings: number | null;
- estimatedDuration: number | null;
-}
-
-function SummaryBox({
- budget,
- totalCost,
- numProperties,
- co2EquivalentSavings,
- totalWorkHours,
- propertyValuationIncrease,
- rentalYieldIncrease,
- energySavings,
- energyCostSavings,
- estimatedDuration,
-}: SummaryBoxProps) {
- function formatMoney(amount: number | null) {
- if (amount === null) {
- return "£0";
- } else {
- return "£" + formatNumber(amount);
- }
- }
-
- function formatBudget(budget: number | null) {
- if (budget === null) {
- return "Not set";
- } else {
- return formatMoney(budget);
- }
- }
-
- function formatHours(hours: number | null) {
- if (hours === null) {
- return "0 hours";
- } else {
- return Math.round(hours) + " hours";
- }
- }
-
- function formatCo2(co2: number | null) {
- if (co2 === null) {
- return "-";
- } else {
- return co2.toFixed(1) + " tonnes";
- }
- }
-
- function formatKwh(energy: number | null) {
- if (energy === null) {
- return "-";
- } else {
- return formatNumber(energy) + " kWh";
- }
- }
-
- const budgetFormatted = formatBudget(budget);
- const totalCostFormatted = formatMoney(totalCost);
- const totalValueIncreaseFormatted = formatMoney(propertyValuationIncrease);
- const totalWorkHoursFormatted = formatHours(totalWorkHours);
- // const rentalYieldIncreaseFormatted = formatMoney(rentalYieldIncrease);
- const energyCostSavingsFormatted = formatMoney(energyCostSavings);
- const co2EquivalentSavingsFormatted = formatCo2(co2EquivalentSavings);
- const energySavingsFormatted = formatKwh(energySavings);
- const estimatedDurationFormatted =
- convertDaysToWorkingWeeks(estimatedDuration);
-
- return (
-
+
Start managing your portfolios
+
+
+ {/* This width has been manually set to align the buttons but should be improved */}
+
+ Sign in with a Social Account
+
+
-
- );
-}
-
export default async function Page({
params,
searchParams,
@@ -203,19 +34,41 @@ export default async function Page({
// This page is served from the server so we can make calls to the database
const portfolioId = params.slug;
- const {
- budget,
- cost: totalCost,
- co2EquivalentSavings,
- totalWorkHours,
- propertyValuationIncrease,
- rentalYieldIncrease,
- energySavings,
- energyCostSavings,
- labourDays,
- } = await getPortfolio(portfolioId);
- // Default limit to 1000 and offset to 0 for now - will handle pagination later
+ let portfolioPerformance = await getPortfolioPerformance(portfolioId);
+ let scenarios;
+
+ if (portfolioPerformance.length > 0) {
+ scenarios = portfolioPerformance.map((performance) => ({
+ id: BigInt(performance.id),
+ name: performance.name || "Default Scenario",
+ budget: performance.budget,
+ totalCost: performance.cost,
+ co2EquivalentSavings: performance.co2EquivalentSavings,
+ propertyValuationIncrease: performance.propertyValuationIncrease,
+ energySavings: performance.energySavings,
+ energyCostSavings: performance.energyCostSavings,
+ labourDays: performance.labourDays,
+ isDefault: performance.isDefault,
+ }));
+ } else {
+ const portfolio = await getPortfolio(portfolioId);
+ scenarios = [
+ {
+ id: BigInt(0),
+ name: "Default",
+ budget: portfolio.budget,
+ totalCost: portfolio.cost,
+ co2EquivalentSavings: portfolio.co2EquivalentSavings,
+ propertyValuationIncrease: portfolio.propertyValuationIncrease,
+ energySavings: portfolio.energySavings,
+ energyCostSavings: portfolio.energyCostSavings,
+ labourDays: portfolio.labourDays,
+ isDefault: true,
+ },
+ ];
+ }
+
const properties: PropertyWithRelations[] = await getProperties(
portfolioId,
1000,
@@ -228,16 +81,8 @@ export default async function Page({
- Portfolio Summary -
-
-
-
-
-
-
-
- - Work Package -
-| Total Budget | -{budgetFormatted} | -
| Total Cost | -- {totalCostFormatted} - | -
| Estimated Duration | -- {estimatedDurationFormatted} - | -
| Total properties | -{numProperties} | -
- {/* Environmental Impact */}
-
-
-
-
- - Environmental Impact -
-| - Annual{" "} - - CO2 - {" "} - Savings - | -- {co2EquivalentSavingsFormatted} - | -
| Annual Energy Savings | -- {energySavingsFormatted} - | -
- {/* Financial Impact table */}
-
-
-
-
- - Financial Impact -
-| - Annual Energy Bill Reduction - | -- {energyCostSavingsFormatted} - | -
| Total Value Increase | -- {totalValueIncreaseFormatted} - | -
diff --git a/src/app/portfolio/[slug]/(portfolio)/summary/page.tsx b/src/app/portfolio/[slug]/(portfolio)/summary/page.tsx
new file mode 100644
index 00000000..c78a39d7
--- /dev/null
+++ b/src/app/portfolio/[slug]/(portfolio)/summary/page.tsx
@@ -0,0 +1,73 @@
+import SummaryTable from "@/app/components/portfolio/summary/SummaryTable";
+import {
+ getNonDefaultPortfolioScenarios,
+ getOverviewPortfolioData,
+} from "../../utils";
+
+export default async function PortfolioSummary({
+ params,
+}: {
+ params: { slug: string };
+}) {
+ const portfolioId = params.slug;
+ const 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 scenarios = await getNonDefaultPortfolioScenarios(portfolioId);
+
+ return (
+ = ({
+ documents,
+ allowedTypes,
+}) => {
+ // Filter the documents based on the allowed types
+ const relevantDocuments = documents.filter((doc) =>
+ allowedTypes.includes(doc.documentType)
+ );
+
+ // Mutation to handle the presigned URL generation
+ const { mutate: fetchPresignedUrl } = useMutation(
+ // Use the file key as the argument to generate the URL
+ async (fileKey: string) => await generatePresignedUrl(fileKey),
+ {
+ onSuccess: (url) => {
+ window.open(url, "_blank"); // Open the file in a new tab
+ },
+ onError: (error) => {
+ console.error("Error generating presigned URL:", error);
+ },
+ }
+ );
+
+ const handleDownload = (documentLocation: string) => {
+ // Generate URL and open in new tab
+ fetchPresignedUrl(documentLocation);
+ };
+
+ return (
+
+
+ );
+};
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/page.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/page.tsx
new file mode 100644
index 00000000..4522de87
--- /dev/null
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/page.tsx
@@ -0,0 +1,188 @@
+import {
+ Card,
+ CardContent,
+ CardHeader,
+ CardTitle,
+} from "@/app/shadcn_components/ui/card";
+
+import {
+ getEnergyAssessment,
+ getEnergyAssessmentDocuments,
+ getPropertyMeta,
+} from "../utils";
+import { DocumentsTable } from "./DocumentsTable";
+import { getEpcColorClass } from "@/app/utils";
+
+// Helper function to clean scenario names
+function cleanScenarioName(scenarioName: string | undefined) {
+ if (!scenarioName) {
+ return scenarioName;
+ }
+
+ return scenarioName.startsWith("Scenario")
+ ? scenarioName.replace(/^Scenario\s*/i, "").trim()
+ : scenarioName;
+}
+
+type InfoCardProps = {
+ title: string;
+ value: number | string;
+ unit: string;
+};
+
+const InfoCard: React.FC = ({ title, value, unit }) => {
+ const isEnergyRating = title === "Energy Rating";
+ const bgColorClass = isEnergyRating ? getEpcColorClass(value.toString()) : ""; // Get the EPC color if it's Energy Rating
+
+ return (
+
+
+
+ {title}
+
+
+
+
+
+ );
+};
+
+export default async function EnergyAssessmentsPage({
+ params,
+}: {
+ params: { slug: string; propertyId: string };
+}) {
+ const propertyMeta = await getPropertyMeta(params.propertyId);
+ const ea = await getEnergyAssessment(propertyMeta.uprn);
+
+ // ea will be an empty object {} if there is no energy assessment
+
+ if (Object.keys(ea).length === 0) {
+ return (
+
[] = [
+ {
+ accessorKey: "areaMeters2",
+ header: "Area (m²)",
+ size: 100,
+ },
+ {
+ accessorKey: "groundAreaMeters2",
+ header: "Ground Area (m²)",
+ size: 100,
+ },
+ {
+ accessorKey: "center.latitude",
+ header: "Latitude",
+ size: 100,
+ },
+ {
+ accessorKey: "center.longitude",
+ header: "Longitude",
+ size: 100,
+ },
+ {
+ accessorKey: "pitchDegrees",
+ header: "Pitch Degrees",
+ size: 100,
+ },
+ {
+ accessorKey: "azimuthDegrees",
+ header: "Azimuth Degrees",
+ size: 100,
+ },
+ {
+ accessorKey: "direction",
+ header: "Direction",
+ size: 50,
+ },
+];
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/utils.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/utils.tsx
new file mode 100644
index 00000000..683eeee0
--- /dev/null
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/utils.tsx
@@ -0,0 +1,30 @@
+import { db } from "@/app/db/db";
+import {
+ SolarInterface,
+ solar,
+ SolarScenario,
+ solarScenario,
+} from "@/app/db/schema/solar";
+import { eq, and } from "drizzle-orm";
+
+export async function getSolarData(uprn: number): Promise {
+ const data = await db.query.solar.findFirst({
+ where: eq(solar.uprn, BigInt(uprn)),
+ });
+
+ return data as SolarInterface;
+}
+
+export async function getSolarScenarioData(
+ solarId: string
+): Promise {
+ const data = await db.query.solarScenario.findFirst({
+ where: (solarScenario, { eq, and }) =>
+ and(
+ eq(solarScenario.solarId, BigInt(solarId)),
+ eq(solarScenario.isDefault, true)
+ ),
+ });
+
+ return data as SolarScenario;
+}
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/utils.ts b/src/app/portfolio/[slug]/building-passport/[propertyId]/utils.ts
index e328401d..37ded61a 100644
--- a/src/app/portfolio/[slug]/building-passport/[propertyId]/utils.ts
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/utils.ts
@@ -1,4 +1,3 @@
-import { recommendation } from "../../../../db/schema/recommendations";
import {
Recommendation,
planRecommendations,
@@ -12,15 +11,59 @@ import {
PropertyMeta,
propertyDetailsEpc,
propertyDetailsSpatial,
+ NonIntrusiveSurveyData,
+ nonInstrusiveSurvey,
} from "@/app/db/schema/property";
import { plan, Plan } from "@/app/db/schema/recommendations";
import { getRating } from "@/app/utils";
import { eq, desc } from "drizzle-orm";
+import {
+ energyAssessment,
+ EnergyAssessment,
+ energyAssessmentDocuments,
+ EnergyAssessmentDocument,
+ EnergyAssessmentDocumentWithScenario,
+} from "@/app/db/schema/energy_assessments";
type RecommendationList = {
recommendation: Recommendation;
}[];
+export async function getEnergyAssessment(
+ uprn: number
+): Promise {
+ const data = await db.query.energyAssessment.findFirst({
+ where: eq(energyAssessment.uprn, BigInt(uprn)),
+ });
+
+ if (!data) {
+ // If there's no data, we return an empty array. This signififies that no energy assessment has been conducted
+ return {} as EnergyAssessment;
+ }
+
+ return data;
+}
+
+export async function getEnergyAssessmentDocuments(
+ energyAssessmentId: bigint
+): Promise {
+ const data = await db.query.energyAssessmentDocuments.findMany({
+ where: eq(
+ energyAssessmentDocuments.energyAssessmentId,
+ BigInt(energyAssessmentId)
+ ),
+ with: {
+ scenario: true,
+ },
+ });
+
+ if (!data) {
+ throw new Error("Network response was not ok");
+ }
+
+ return data;
+}
+
export async function getRecommendations(
planId: string
): Promise {
@@ -124,6 +167,27 @@ export async function getSpatialData(
return data;
}
+export async function getNonIntrusiveSurvey(
+ uprn: number
+): Promise {
+ // Query to find the newest survey for a given UPRN
+ const data = await db.query.nonInstrusiveSurvey.findMany({
+ where: eq(nonInstrusiveSurvey.uprn, BigInt(uprn)),
+ orderBy: desc(nonInstrusiveSurvey.surveyDate),
+ columns: { surveyDate: true, surveyor: true, uprn: true },
+ limit: 1,
+ with: {
+ notes: {
+ columns: {
+ title: true,
+ note: true,
+ },
+ },
+ },
+ });
+ return data[0];
+}
+
export function formatGeneralFeatures(
conditionReportData: PropertyDetailsEpc,
propertyType: string
@@ -269,8 +333,8 @@ export function formatHeatDemandFeatures(
return [
{
feature: "Estimated energy consumption",
- description: conditionReportData.adjustedEnergyConsumption
- ? `${conditionReportData.adjustedEnergyConsumption.toFixed(0)} kWh/year`
+ description: conditionReportData.currentEnergyDemand
+ ? `${conditionReportData.currentEnergyDemand.toFixed(0)} kWh/year`
: "Unknown",
},
{
diff --git a/src/app/portfolio/[slug]/components/propertyTableColumns.tsx b/src/app/portfolio/[slug]/components/propertyTableColumns.tsx
index 7788dd13..67ed29fe 100644
--- a/src/app/portfolio/[slug]/components/propertyTableColumns.tsx
+++ b/src/app/portfolio/[slug]/components/propertyTableColumns.tsx
@@ -153,6 +153,7 @@ export const columns: ColumnDef[] = [
const recommendations = row.original.recommendations;
const currentSapPoints = row.original.currentSapPoints;
+
const expectedapPoints = recommendations.reduce(
(acc: number, rec: PropertyToRecommendation) => {
if (rec.sapPoints === null || rec.sapPoints === undefined) {
diff --git a/src/app/portfolio/[slug]/utils.ts b/src/app/portfolio/[slug]/utils.ts
index c268c7fa..c50bcd2e 100644
--- a/src/app/portfolio/[slug]/utils.ts
+++ b/src/app/portfolio/[slug]/utils.ts
@@ -1,16 +1,19 @@
-import {
- recommendation,
- UnnestedRecommendation,
- PortfolioPlanRecommendation,
- RecommendationWithMaterials,
-} from "./../../db/schema/recommendations";
+import { formatNumber } from "@/app/utils";
import { and, eq, inArray } from "drizzle-orm";
import { db } from "@/app/db/db";
import { portfolio } from "@/app/db/schema/portfolio";
import { property } from "@/app/db/schema/property";
import type { Portfolio } from "@/app/db/schema/portfolio";
import type { PropertyWithRelations } from "@/app/db/schema/property";
-import { plan, planRecommendations } from "@/app/db/schema/recommendations";
+import {
+ plan,
+ planRecommendations,
+ recommendation,
+ UnnestedRecommendation,
+ PortfolioPlanRecommendation,
+ scenario,
+ ScenarioSelect,
+} from "@/app/db/schema/recommendations";
export async function getPortfolio(portfolioId: string): Promise {
const data = await db
@@ -29,11 +32,339 @@ export async function getPortfolio(portfolioId: string): Promise {
return data[0];
}
+export async function getPortfolioPerformance(
+ portfolioId: string
+): Promise {
+ // This function will grab portfolio metrics from the database, but it will firstly check for the existence of scenarios and
+ // use those figures. If they don't exist, we will use the default figures from the portfolio table
+ const scenarios = await db
+ .select()
+ .from(scenario)
+ .where(eq(scenario.portfolioId, BigInt(portfolioId)));
+
+ // If we have scenarios, return them
+ if (scenarios.length > 0) {
+ return scenarios;
+ }
+
+ return [];
+}
+
+// Types needed for the overview page
+export 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 {
+ // Keep just the columns we need for the overview
+
+ // We firstly attempt to retrieve the data from the scenarios table, starting with the default
+ // scenario. If the default scenario doesn't exist, we'll use the data from the
+ // portfolio
+ let data = await db
+ .select({
+ name: scenario.name,
+ cost: scenario.cost,
+ epcBreakdownPreRetrofit: scenario.epcBreakdownPreRetrofit,
+ epcBreakdownPostRetrofit: scenario.epcBreakdownPostRetrofit,
+ numberOfProperties: scenario.numberOfProperties,
+ nUnitsToRetrofit: scenario.nUnitsToRetrofit,
+ co2PerUnitPreRetrofit: scenario.co2PerUnitPreRetrofit,
+ co2PerUnitPostRetrofit: scenario.co2PerUnitPostRetrofit,
+ energyBillPerUnitPreRetrofit: scenario.energyBillPerUnitPreRetrofit,
+ energyBillPerUnitPostRetrofit: scenario.energyBillPerUnitPostRetrofit,
+ energyConsumptionPerUnitPreRetrofit:
+ scenario.energyConsumptionPerUnitPreRetrofit,
+ energyConsumptionPerUnitPostRetrofit:
+ scenario.energyConsumptionPerUnitPostRetrofit,
+ valuationImprovementPerUnit: scenario.valuationImprovementPerUnit,
+ costPerUnit: scenario.costPerUnit,
+ costPerCo2Saved: scenario.costPerCo2Saved,
+ costPerSapPoint: scenario.costPerSapPoint,
+ valuationReturnOnInvestment: scenario.valuationReturnOnInvestment,
+ })
+ .from(scenario)
+ .where(
+ and(
+ eq(scenario.portfolioId, BigInt(portfolioId)),
+ eq(scenario.isDefault, true)
+ )
+ );
+
+ if (data.length === 0) {
+ // If we have no data, we fetch it from the scenarios. This will facilitate this for older portfolios
+ 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 we still have no data, we throw and error
+ 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: DataItem[] = [
+ {
+ title: "EPCs",
+ scenarios: [
+ {
+ scenarioName: "Today",
+ data: JSON.parse(
+ data[0].epcBreakdownPreRetrofit || "[]"
+ ) as ChartData[],
+ },
+ {
+ scenarioName: portfolioName || "Default",
+ data: JSON.parse(
+ data[0].epcBreakdownPostRetrofit || "[]"
+ ) as ChartData[],
+ },
+ ],
+ },
+ {
+ title: "# Units",
+ scenarios: [
+ {
+ scenarioName: "Today",
+ data: String(data[0].numberOfProperties) || "",
+ },
+ {
+ scenarioName: portfolioName || "Default",
+ data: String(data[0].numberOfProperties) || "",
+ },
+ ],
+ },
+ {
+ title: "# Units to retrofit",
+ scenarios: [
+ { scenarioName: "Today", data: "-" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: String(data[0].nUnitsToRetrofit) || "",
+ },
+ ],
+ },
+ {
+ title: "CO2/unit",
+ scenarios: [
+ { scenarioName: "Today", data: data[0].co2PerUnitPreRetrofit || "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].co2PerUnitPostRetrofit || "",
+ },
+ ],
+ },
+ {
+ title: "Annual energy bill/unit",
+ scenarios: [
+ {
+ scenarioName: "Today",
+ data: data[0].energyBillPerUnitPreRetrofit || "",
+ },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].energyBillPerUnitPostRetrofit || "",
+ },
+ ],
+ },
+ {
+ title: "Annual energy demand (kWh)/unit",
+ scenarios: [
+ {
+ scenarioName: "Today",
+ data: data[0].energyConsumptionPerUnitPreRetrofit || "",
+ },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].energyConsumptionPerUnitPostRetrofit || "",
+ },
+ ],
+ },
+ {
+ title: "Cost (£)",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: "£" + formatNumber(data[0].cost || 0),
+ },
+ ],
+ },
+ {
+ title: "Cost (£)/unit",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].costPerUnit || "",
+ },
+ ],
+ },
+ {
+ title: "£ per CO2 reduction",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].costPerCo2Saved || "",
+ },
+ ],
+ },
+ {
+ title: "£ per SAP point",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].costPerSapPoint || "",
+ },
+ ],
+ },
+ {
+ title:
+ "Potential valuation improvement/unit - highly indicative EPC effect*",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].valuationImprovementPerUnit || "",
+ },
+ ],
+ },
+ {
+ title:
+ "Potential valuation return on investment - highly indicative EPC effect*",
+ scenarios: [
+ { scenarioName: "Today", data: "" },
+ {
+ scenarioName: portfolioName || "Default",
+ data: data[0].valuationReturnOnInvestment || "",
+ },
+ ],
+ },
+ ];
+
+ return output;
+}
+
+export async function getNonDefaultPortfolioScenarios(
+ portfolioId: string
+): Promise<{ id: bigint; name: string | null }[]> {
+ // For a given portfolio Id, we want to retrieve all of the scenarios that are attributed to this portfolio
+ // We exclude the default scenario
+ const scenarios = await db
+ .select({
+ id: scenario.id,
+ name: scenario.name,
+ })
+ .from(scenario)
+ .where(
+ and(
+ eq(scenario.portfolioId, BigInt(portfolioId)),
+ eq(scenario.isDefault, false)
+ )
+ );
+
+ return scenarios;
+}
+
export async function getProperties(
portfolioId: string,
limit: number = 1000,
offset: number = 0
): Promise {
+ // When pulling in the associated recommendations, we need to pull in the associated plan and take recommendations that are associated to the
+ // default plans
+
+ // const data: PropertyWithRelations[] = await db.query.property.findMany({
+ // limit: limit,
+ // offset: offset,
+ // columns: {
+ // id: true,
+ // portfolioId: true,
+ // address: true,
+ // postcode: true,
+ // status: true,
+ // creationStatus: true,
+ // currentEpcRating: true,
+ // currentSapPoints: true,
+ // },
+ // where: eq(property.portfolioId, BigInt(portfolioId)),
+ // with: {
+ // target: {
+ // columns: {
+ // epc: true,
+ // },
+ // },
+ // recommendations: {
+ // columns: {
+ // id: true,
+ // estimatedCost: true,
+ // sapPoints: true,
+ // },
+ // where: eq(recommendation.default, true),
+ // with: {
+ // planRecommendations: {
+ // columns: {
+ // planId: true,
+ // },
+ // with: {
+ // plan: {
+ // columns: {
+ // id: true,
+ // isDefault: true,
+ // },
+ // where: eq(plan.isDefault, true),
+ // },
+ // },
+ // },
+ // },
+ // },
+ // },
+ // });
+
+ // We need to perform the query like this because the nested query is not supported in the ORM right now
const data: PropertyWithRelations[] = await db.query.property.findMany({
limit: limit,
offset: offset,
@@ -56,10 +387,23 @@ export async function getProperties(
},
recommendations: {
columns: {
+ id: true,
estimatedCost: true,
sapPoints: true,
},
- where: eq(recommendation.default, true),
+ where: and(
+ eq(recommendation.default, true),
+ inArray(
+ recommendation.id,
+ db
+ .select({
+ recommendationId: planRecommendations.recommendationId,
+ })
+ .from(planRecommendations)
+ .innerJoin(plan, eq(plan.id, planRecommendations.planId))
+ .where(eq(plan.isDefault, true))
+ )
+ ),
},
},
});
diff --git a/src/app/utils.ts b/src/app/utils.ts
index c227756c..f8371c7a 100644
--- a/src/app/utils.ts
+++ b/src/app/utils.ts
@@ -48,7 +48,7 @@ export const getEpcColorClass = (letter: string) => {
case "F":
return "bg-epc_f";
case "G":
- return "bg-epc_d";
+ return "bg-epc_g";
default:
return "bg-gray-500";
}
diff --git a/src/types/recommendations.ts b/src/types/recommendations.ts
index 4e603e07..fd0f610f 100644
--- a/src/types/recommendations.ts
+++ b/src/types/recommendations.ts
@@ -7,4 +7,12 @@ export interface RecommendationMetricMap {
low_energy_lighting: number;
windows_glazing: number;
solar_pv: number;
+ heating: number;
+ hot_water_tank_insulation: number;
+ heating_control: number;
+ secondary_heating: number;
+ cylinder_thermostat: number;
+ trickle_vents: number;
+ mixed_glazing: number;
+ draught_proofing: number;
}
diff --git a/tailwind.config.js b/tailwind.config.js
index 65cc116f..7521e9e3 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,5 +1,6 @@
const { fontFamily } = require("tailwindcss/defaultTheme");
/** @type {import('tailwindcss').Config} */
+const colors = require("tailwindcss/colors"); // Correctly import colors
module.exports = {
darkMode: ["class"],
@@ -7,8 +8,12 @@ module.exports = {
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
+ // Path to Tremor module
+ "./node_modules/@tremor/**/*.{js,ts,jsx,tsx}",
],
theme: {
+ transparent: "transparent",
+ current: "currentColor",
container: {
center: true,
padding: "2rem",
@@ -23,6 +28,67 @@ module.exports = {
"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
},
colors: {
+ // Tremor light mode
+ tremor: {
+ brand: {
+ faint: colors.blue[50],
+ muted: colors.blue[200],
+ subtle: colors.blue[400],
+ DEFAULT: colors.blue[500],
+ emphasis: colors.blue[700],
+ inverted: colors.white,
+ },
+ background: {
+ muted: colors.gray[50],
+ subtle: colors.gray[100],
+ DEFAULT: colors.white,
+ emphasis: colors.gray[700],
+ },
+ border: {
+ DEFAULT: colors.gray[200],
+ },
+ ring: {
+ DEFAULT: colors.gray[200],
+ },
+ content: {
+ subtle: colors.gray[400],
+ DEFAULT: colors.gray[500],
+ emphasis: colors.gray[700],
+ strong: colors.gray[900],
+ inverted: colors.white,
+ },
+ },
+ // Tremor dark mode
+ // dark mode
+ "dark-tremor": {
+ brand: {
+ faint: "#0B1229",
+ muted: colors.blue[950],
+ subtle: colors.blue[800],
+ DEFAULT: colors.blue[500],
+ emphasis: colors.blue[400],
+ inverted: colors.blue[950],
+ },
+ background: {
+ muted: "#131A2B",
+ subtle: colors.gray[800],
+ DEFAULT: colors.gray[900],
+ emphasis: colors.gray[300],
+ },
+ border: {
+ DEFAULT: colors.gray[800],
+ },
+ ring: {
+ DEFAULT: colors.gray[800],
+ },
+ content: {
+ subtle: colors.gray[600],
+ DEFAULT: colors.gray[500],
+ emphasis: colors.gray[200],
+ strong: colors.gray[50],
+ inverted: colors.gray[950],
+ },
+ },
epc_a: "#117d58",
epc_b: "#2da55c",
epc_c: "#8dbd40",
@@ -35,6 +101,7 @@ module.exports = {
brandtan: "#d3b488",
hovertan: "#947750",
brandgold: "#f1bb06",
+ hovergold: "#c79d12",
brandbrown: "#3d1e05",
brandmidblue: "#3943b7",
border: "hsl(var(--border))",
@@ -104,6 +171,31 @@ module.exports = {
maxWidth: {
"8xl": "90rem",
},
+ boxShadow: {
+ // light
+ "tremor-input": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+ "tremor-card":
+ "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
+ "tremor-dropdown":
+ "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
+ // dark
+ "dark-tremor-input": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+ "dark-tremor-card":
+ "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
+ "dark-tremor-dropdown":
+ "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
+ },
+ borderRadius: {
+ "tremor-small": "0.375rem",
+ "tremor-default": "0.5rem",
+ "tremor-full": "9999px",
+ },
+ fontSize: {
+ "tremor-label": ["0.75rem", { lineHeight: "1rem" }],
+ "tremor-default": ["0.875rem", { lineHeight: "1.25rem" }],
+ "tremor-title": ["1.125rem", { lineHeight: "1.75rem" }],
+ "tremor-metric": ["1.875rem", { lineHeight: "2.25rem" }],
+ },
},
},
variants: {
@@ -111,6 +203,58 @@ module.exports = {
visibility: ["group-hover"],
},
},
+ safelist: [
+ {
+ pattern:
+ /^(bg-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ variants: ["hover", "ui-selected"],
+ },
+ {
+ pattern:
+ /^(text-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ variants: ["hover", "ui-selected"],
+ },
+ {
+ pattern:
+ /^(border-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ variants: ["hover", "ui-selected"],
+ },
+ {
+ pattern:
+ /^(ring-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ },
+ {
+ pattern:
+ /^(stroke-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ },
+ {
+ pattern:
+ /^(fill-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
+ },
+ // This enables the EPC colours for tremor. They're listed from EPC G -> A
+ ...[
+ "[#e41e3b]",
+ "[#ef8026]",
+ "[#f3a96a]",
+ "[#f7cd14]",
+ "[#8dbd40]",
+ "[#2da55c]",
+ "[#117d58]",
+ ].flatMap((customColor) => [
+ `bg-${customColor}`,
+ `border-${customColor}`,
+ `hover:bg-${customColor}`,
+ `hover:border-${customColor}`,
+ `hover:text-${customColor}`,
+ `fill-${customColor}`,
+ `ring-${customColor}`,
+ `stroke-${customColor}`,
+ `text-${customColor}`,
+ `ui-selected:bg-${customColor}`,
+ `ui-selected:border-${customColor}`,
+ `ui-selected:text-${customColor}`,
+ ]),
+ ],
plugins: [
function ({ addVariant }) {
addVariant("important", ({ container }) => {
@@ -122,5 +266,7 @@ module.exports = {
});
});
},
+ require("@headlessui/tailwindcss"),
+ require("@tailwindcss/forms"),
],
};
diff --git a/tsconfig.json b/tsconfig.json
index 64681559..7f10c944 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,8 +1,8 @@
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
- "target": "es5",
- // "target": "ESNext",
+ // "target": "es5",
+ "target": "ESNext",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
+
+ );
+}
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/DocumentsTable.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/DocumentsTable.tsx
new file mode 100644
index 00000000..5a58717f
--- /dev/null
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/energy-assessment/DocumentsTable.tsx
@@ -0,0 +1,105 @@
+"use client";
+
+import React from "react";
+import {
+ Table,
+ TableBody,
+ TableCell,
+ TableRow,
+} from "@/app/shadcn_components/ui/table";
+import { BrandButton } from "@/app/components/Buttons";
+import { useMutation } from "@tanstack/react-query";
+import { DocumentType } from "@/app/db/schema/energy_assessments";
+
+// Use the type directly from the array
+type Document = {
+ id: bigint;
+ documentType: (typeof DocumentType)[number]; // Create a union type from the array
+ documentLocation: string; // S3 file key
+ uploadedAt: Date;
+};
+
+type Props = {
+ documents: Document[];
+ allowedTypes: (typeof DocumentType)[number][]; // Use the union type for allowedTypes as well
+};
+
+// Descriptions based on the document types
+const descriptions: { [key in (typeof DocumentType)[number]]: string } = {
+ EPR: "Contains current energy performance of your home, and recommendations for improvement",
+ "Condition Report":
+ "Detailed report on property condition, including photographs",
+ "Evidence Report": "Additional photographic evidence from the survey",
+ "Summary Information": "Summarized survey outputs and site notes",
+ "Floor Plan": "Layout of the property and room/window dimensions",
+ "Scenario Draft EPC": "Draft EPC based on a given scenario",
+ "Scenario Site Notes": "Site notes from the scenario analysis",
+};
+
+// Fetch the presigned URL from the API
+async function generatePresignedUrl(fileKey: string) {
+ const response = await fetch("/api/energy-assessment-documents", {
+ method: "POST",
+ body: JSON.stringify({ fileKey }),
+ });
+
+ if (!response.ok) {
+ throw new Error("Failed to generate presigned URL");
+ }
+
+ const data = await response.json();
+ return data.url;
+}
+
+export const DocumentsTable: React.FCSummary
+
+ * Valuation improvement is based on these studies from
+
+ Rightmove
+
+ ,
+
+ Knight Frank
+
+ ,
+
+ MoneySuperMarket
+
+ ,
+
+ Lloyds
+
+ , and
+
+ Nationwide
+
+ .
+
+
+ {value}
+ {unit}
+
+
+
+ );
+ }
+
+ const documents = await getEnergyAssessmentDocuments(ea.id);
+
+ const table1AllowedTypes = [
+ "EPR",
+ "Condition Report",
+ "Evidence Report",
+ "Summary Information",
+ "Floor Plan",
+ ];
+
+ const scenarioAllowedTypes = ["Scenario Draft EPC", "Scenario Site Notes"];
+
+ // Separate core documents and scenario-specific documents
+ const coreDocuments = documents.filter(
+ (doc) =>
+ doc.scenarioId === null && table1AllowedTypes.includes(doc.documentType)
+ );
+
+ const scenarioDocuments = documents.filter(
+ (doc) =>
+ doc.scenarioId !== null && scenarioAllowedTypes.includes(doc.documentType)
+ );
+
+ // Extract unique scenarios from the documents
+ const scenarios = Array.from(
+ new Set(scenarioDocuments.map((doc) => doc.scenario?.scenarioName))
+ ).filter(Boolean); // Filter out any null or undefined scenario names
+
+ return (
+
+
+
+ This property does not have a Domna energy assessment
+
+ Please check back later for updates.
+
+ {/* EPC Card and Summary Information */}
+
+ );
+}
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/page.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/page.tsx
index 15d0f5cd..376fdc00 100644
--- a/src/app/portfolio/[slug]/building-passport/[propertyId]/page.tsx
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/page.tsx
@@ -21,15 +21,13 @@ export default async function BuildingPassportHome({
// the response is cached so we just gain access to the data
const propertyMeta = await getPropertyMeta(params.propertyId);
- console.log(propertyMeta);
-
return (
+ {/* EPC Rating Card */}
+
+
+
+ {/* Core Survey Documents */}
+
+
+
+ {/* Scenario-Specific Documents */}
+ {scenarios.map((scenarioName) => {
+ const scenarioDocs = scenarioDocuments.filter(
+ (doc) => doc.scenario?.scenarioName === scenarioName
+ );
+
+ return (
+
+ Core Survey Documents
+
+
+
+
+
+ );
+ })}
+
+ Scenario: {cleanScenarioName(scenarioName)}
+
+
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/plans/page.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/plans/page.tsx
index 5c40507e..02468ca1 100644
--- a/src/app/portfolio/[slug]/building-passport/[propertyId]/plans/page.tsx
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/plans/page.tsx
@@ -9,6 +9,7 @@ function PlanCard({
createdAt,
totalEstimatedCost,
totalSapPoints,
+ planName,
planId,
isDefault,
}: {
@@ -16,6 +17,7 @@ function PlanCard({
createdAt: Date;
totalEstimatedCost: number;
totalSapPoints: number;
+ planName: string | null;
planId: string;
isDefault: boolean;
}) {
@@ -25,11 +27,17 @@ function PlanCard({
-
+ {planName && (
+
+
+ {nonIntrusiveSurvey && (
+
+ {planName}
+
+ )}
+
Total cost:
@@ -103,6 +111,7 @@ export default async function RecommendationPlans({
createdAt={plan.createdAt}
totalEstimatedCost={totalEstimatedCost}
totalSapPoints={totalSapPoints}
+ planName={plan.name}
planId={String(plan.id)}
isDefault={plan.isDefault}
/>
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/pre-assessment-report/page.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/pre-assessment-report/page.tsx
index 1f7c118f..402cc7e0 100644
--- a/src/app/portfolio/[slug]/building-passport/[propertyId]/pre-assessment-report/page.tsx
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/pre-assessment-report/page.tsx
@@ -9,6 +9,7 @@ import {
import { formatDateTime } from "@/app/utils";
import {
generalColumns,
+ nonInstrusiveColumns,
retrofitColumns,
} from "@/app/components/building-passport/FeatureTableColumns";
import {
@@ -18,6 +19,7 @@ import {
getConditionReport,
getPropertyMeta,
getSpatialData,
+ getNonIntrusiveSurvey,
} from "../utils";
function AddressCard({ address }: { address: string | null }) {
@@ -116,6 +118,16 @@ function PropertyDetailsCard({
);
}
+const formatDate = (dateString: Date) => {
+ const date = new Date(dateString);
+ return date.toLocaleDateString("en-GB", {
+ weekday: "long", // "Monday" through "Sunday"
+ year: "numeric", // "2024"
+ month: "long", // "January" through "December"
+ day: "numeric", // "1", "2", ..., "31"
+ });
+};
+
export default async function PreAssessmentReport({
params,
}: {
@@ -129,6 +141,8 @@ export default async function PreAssessmentReport({
propertyMeta.propertyType
);
+ const nonIntrusiveSurvey = await getNonIntrusiveSurvey(propertyMeta.uprn);
+
const retrofitFeatures = formatRetrofitFeatures(conditionReportData);
const heatingDemand = formatHeatDemandFeatures(conditionReportData);
@@ -153,6 +167,20 @@ export default async function PreAssessmentReport({
/>
+
+ )}
Non-Intrusive Survey
+
+ Conducted by: {nonIntrusiveSurvey.surveyor} on{" "}
+ {formatDate(nonIntrusiveSurvey.surveyDate)}
+
+ General Features
Existing Property Features
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/page.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/page.tsx
new file mode 100644
index 00000000..e8323955
--- /dev/null
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/page.tsx
@@ -0,0 +1,223 @@
+import {
+ FlagIcon,
+ LightBulbIcon,
+ SunIcon,
+ InformationCircleIcon,
+ CloudIcon,
+ SparklesIcon,
+ BoltIcon,
+ CurrencyDollarIcon,
+ ArrowTrendingUpIcon,
+ HomeIcon,
+} from "@heroicons/react/24/outline";
+import { getPropertyMeta } from "../utils";
+import { getSolarData, getSolarScenarioData } from "./utils";
+import FeatureTable from "@/app/components/building-passport/FeatureTable";
+import { roofSegmentsColumns } from "./roof-segments-table";
+import { formatNumber } from "@/app/utils";
+
+export default async function SolarAnalysisPage({
+ params,
+}: {
+ params: { slug: string; propertyId: string };
+}) {
+ const propertyMeta = await getPropertyMeta(params.propertyId);
+ const solarData = await getSolarData(Number(propertyMeta.uprn));
+ // If there's no solar data, we cannot display the page
+
+ if (!solarData) {
+ return (
+
+
+ );
+ }
+
+ const solarScenarioData = await getSolarScenarioData(String(solarData.id));
+
+ const {
+ panelWidthMeters,
+ panelHeightMeters,
+ panelCapacityWatts,
+ panelLifetimeYears,
+ maxSunshineHoursPerYear,
+ carbonOffsetFactorKgPerMwh,
+ roofSegmentStats,
+ } = solarData.googleApiResponse.solarPotential;
+
+ const getDirectionFromAzimuth = (azimuth: number): string => {
+ if ((azimuth >= 330 && azimuth <= 360) || (azimuth >= 0 && azimuth < 30))
+ return "N";
+ if (azimuth >= 30 && azimuth < 60) return "NE";
+ if (azimuth >= 60 && azimuth < 120) return "E";
+ if (azimuth >= 120 && azimuth < 150) return "SE";
+ if (azimuth >= 150 && azimuth < 210) return "S";
+ if (azimuth >= 210 && azimuth < 240) return "SW";
+ if (azimuth >= 240 && azimuth < 300) return "W";
+ if (azimuth >= 300 && azimuth < 330) return "NW";
+ return "";
+ };
+
+ const transformedRoofSegmentStats = roofSegmentStats.map(
+ ({ segmentIndex, stats, center, azimuthDegrees, ...rest }) => ({
+ ...rest,
+ areaMeters2: stats.areaMeters2.toFixed(1),
+ groundAreaMeters2: stats.groundAreaMeters2.toFixed(1),
+ azimuthDegrees: azimuthDegrees.toFixed(1),
+ center: {
+ latitude: center.latitude.toFixed(6),
+ longitude: center.longitude.toFixed(6),
+ },
+ sunshineQuantiles: stats.sunshineQuantiles.join(", "), // Join sunshineQuantiles into a string
+ direction: getDirectionFromAzimuth(azimuthDegrees),
+ })
+ );
+
+ return (
+
+
+
+ No Solar Analysis Data Available
+
+ Please check back later for updates.
+
+
+ );
+}
diff --git a/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/roof-segments-table.tsx b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/roof-segments-table.tsx
new file mode 100644
index 00000000..0a980666
--- /dev/null
+++ b/src/app/portfolio/[slug]/building-passport/[propertyId]/solar-analysis/roof-segments-table.tsx
@@ -0,0 +1,41 @@
+// components/roof-segments-table.ts
+import { RoofSegment } from "@/app/db/schema/solar";
+import { ColumnDef } from "@tanstack/react-table";
+
+export const roofSegmentsColumns: ColumnDef
+
+
+
+
+
+
+
+ + Simulation Panel Configuration +
+
+
+
+
+ + Dimensions: {panelWidthMeters}m x {panelHeightMeters}m +
+
+
+ + Wattage: {panelCapacityWatts}W +
+
+
+ + Lifetime: {panelLifetimeYears} years +
+
+
+ + Region: {solarData.googleApiResponse.regionCode} +
+
+
+
+ + Weather and Environmental Data +
+
+
+
+
+ + Max Sunshine Hours per Year: {maxSunshineHoursPerYear} hours +
+
+
+ + Carbon Offset Factor: {carbonOffsetFactorKgPerMwh} kg/MWh +
+
+
+
+ + Roof Segments Data +
+
+
+
+
+
+
+ + Solar PV Simulation +
+-
+
-
+
+ Number of panels: {solarScenarioData.numberPanels} +
+ -
+
+ Array output: {solarScenarioData.arrayKwhp} kWp +
+ -
+
+ Lifetime DC energy:{" "} + {Math.round(solarScenarioData.lifetimeDcKwh)} kWh +
+ -
+
+ Yearly DC energy: {Math.round( + solarScenarioData.yearlyDcKwh + )}{" "} + kWh +
+ {solarScenarioData.lifetimeAcKwh !== null && (
+ -
+
+ Lifetime AC energy:{" "} + {Math.round(solarScenarioData.lifetimeAcKwh)} kWh +
+ )}
+ {solarScenarioData.yearlyAcKwh !== null && (
+ -
+
+ Yearly AC energy:{" "} + {Math.round(solarScenarioData.yearlyAcKwh)} kWh +
+ )}
+ -
+
+ Cost: £{formatNumber(solarScenarioData.cost)} +
+ -
+
+ Expected payback years:{" "} + {solarScenarioData.expectedPaybackYears} +
+ -
+
+ Panelled roof area:{" "} + {solarScenarioData.panelledRoofArea.toFixed(1)} m² +
+
+ 
*/}
+
+ Map not currently available
+ {/* */}
+