Merge pull request #1 from hmatland/main

ft^2 support

package.json

@@ -10,7 +10,7 @@
  "preview": "vite preview --port 8081"
  },
  "dependencies": {
- "forma-embedded-view-sdk": "^0.35.0",
+ "forma-embedded-view-sdk": "^0.55.0",
  "preact": "^10.19.1",
  "prettier": "^3.1.0"
  },

src/app.tsx

@@ -1,8 +1,8 @@
+import { FunctionBreakdownMetric } from "forma-embedded-view-sdk/areaMetrics";
 import { Forma } from "forma-embedded-view-sdk/auto";
 import { useEffect, useMemo, useState } from "react";
 
-//@ts-ignore
-import { FunctionBreakdownMetric } from "forma-embedded-view-sdk/dist/internal/areaMetrics";
+export const METER_TO_FEET = 3.28084;
 
 const LOCAL_STORAGE_KEY = "parking-demand-extension";
 const getLocalStorage = (): Record<string, number> => {
@@ -25,22 +25,35 @@ function SqmPerSpotPerFunction({
  sqm: number;
  setSqm: (demand: number) => void;
 }) {
+ const [imperialUnits, setImperialUnits] = useState<boolean>(false);
+ useEffect(() => {
+ Forma.getPresentationUnitSystem().then((value) =>
+ setImperialUnits(value === "imperial")
+ );
+ }, [setImperialUnits]);
  function onInput(event: Event) {
  const { value } = event.target as HTMLInputElement;
  if (isNaN(Number(value))) {
  return;
  }
- setSqm(Number(value));
+ const convertedValue = imperialUnits
+ ? Number(value) / METER_TO_FEET / METER_TO_FEET
+ : Number(value);
+ setSqm(convertedValue);
  }
 
+ const value = imperialUnits
+ ? Math.round(sqm * METER_TO_FEET * METER_TO_FEET)
+ : sqm;
+
  return (
  /* @ts-ignore */
  <weave-input
  class="sqm-input"
  onInput={onInput}
  type="number"
- value={sqm || 0}
- unit="m²"
+ value={value || 0}
+ unit={imperialUnits ? "ft²" : "m²"}
  />
  );
 }
@@ -73,11 +86,11 @@ function RightPanel() {
  Forma.areaMetrics.calculate({}).then((metrics) => {
  const functionBreakdownMetrics =
  metrics.builtInMetrics.grossFloorArea.functionBreakdown.filter(
- (func) => func.functionId != "unspecified",
+ (func) => func.functionId != "unspecified"
  );
  setGfaPerFunction(functionBreakdownMetrics);
  const sqmPerSpotPerFunction = Object.fromEntries(
- functionBreakdownMetrics.map((metric) => [metric.functionId, 50]),
+ functionBreakdownMetrics.map((metric) => [metric.functionId, 50])
  );
 
  if (!localStorage.getItem(LOCAL_STORAGE_KEY)) {
@@ -100,19 +113,24 @@ function RightPanel() {
  const demandPerFunction: Record<string, number> = {};
  gfaPerFunction.forEach((metric) => {
  const sqmPerSpot = sqmPerSpotPerFunction[metric.functionId];
+ if (metric.value === "UNABLE_TO_CALCULATE") {
+ throw new Error(
+ `Metric value for ${metric.functionId} was "UNABLE_TO_CALCULATE"`
+ );
+ }
  if (!sqmPerSpot) {
  demandPerFunction[metric.functionId] = 0;
  } else {
  demandPerFunction[metric.functionId] = round(
- metric.value / sqmPerSpotPerFunction[metric.functionId],
+ metric.value / sqmPerSpotPerFunction[metric.functionId]
  );
  }
  });
  return demandPerFunction;
  }, [sqmPerSpotPerFunction]);
 
  function setSqmPerSpotForFunction(
- functionId: string,
+ functionId: string
  ): (demand: number) => void {
  return function (demand: number) {
  setSqmPerSpotPerFunction((prev) => {
@@ -126,7 +144,7 @@ function RightPanel() {
  const totalDemand = useMemo(() => {
  return Object.values(demandPerFunction).reduce(
  (acc, curr) => acc + curr,
- 0,
+ 0
  );
  }, [demandPerFunction]);