feat: Updates to using ResultView to handle errors.

Public/css/output.css

@@ -2206,9 +2206,6 @@
   .collapse {
     visibility: collapse;
   }
-  .invisible {
-    visibility: hidden;
-  }
   .visible {
     visibility: visible;
   }
@@ -5363,15 +5360,15 @@
       }
     }
   }
-  .my-1 {
-    margin-block: calc(var(--spacing) * 1);
-  }
   .my-1\.5 {
     margin-block: calc(var(--spacing) * 1.5);
   }
   .my-2 {
     margin-block: calc(var(--spacing) * 2);
   }
+  .my-auto {
+    margin-block: auto;
+  }
   .label {
     @layer daisyui.l1.l2.l3 {
       display: inline-flex;
@@ -5578,15 +5575,6 @@
   .ms-4 {
     margin-inline-start: calc(var(--spacing) * 4);
   }
-  .ms-6 {
-    margin-inline-start: calc(var(--spacing) * 6);
-  }
-  .ms-8 {
-    margin-inline-start: calc(var(--spacing) * 8);
-  }
-  .me-4 {
-    margin-inline-end: calc(var(--spacing) * 4);
-  }
   .modal-action {
     @layer daisyui.l1.l2.l3 {
       margin-top: calc(0.25rem * 6);
@@ -6760,9 +6748,6 @@
   .grid-cols-1 {
     grid-template-columns: repeat(1, minmax(0, 1fr));
   }
-  .grid-cols-2 {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
   .grid-cols-5 {
     grid-template-columns: repeat(5, minmax(0, 1fr));
   }
@@ -7811,9 +7796,6 @@
   .px-4 {
     padding-inline: calc(var(--spacing) * 4);
   }
-  .py-1 {
-    padding-block: calc(var(--spacing) * 1);
-  }
   .py-1\.5 {
     padding-block: calc(var(--spacing) * 1.5);
   }
@@ -7826,9 +7808,6 @@
   .ps-2 {
     padding-inline-start: calc(var(--spacing) * 2);
   }
-  .ps-8 {
-    padding-inline-start: calc(var(--spacing) * 8);
-  }
   .file-input-xl {
     @layer daisyui.l1.l2 {
       padding-inline-end: calc(0.25rem * 6);
@@ -9377,6 +9356,13 @@
       }
     }
   }
+  .hover\:text-white {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-white);
+      }
+    }
+  }
   .focus\:outline {
     &:focus {
       outline-style: var(--tw-outline-style);
@@ -9393,11 +9379,6 @@
       outline-color: var(--color-indigo-600);
     }
   }
-  .md\:grid-cols-1 {
-    @media (width >= 48rem) {
-      grid-template-columns: repeat(1, minmax(0, 1fr));
-    }
-  }
   .md\:grid-cols-2 {
     @media (width >= 48rem) {
       grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -9456,26 +9437,6 @@
       }
     }
   }
-  .lg\:visible {
-    @media (width >= 64rem) {
-      visibility: visible;
-    }
-  }
-  .lg\:block {
-    @media (width >= 64rem) {
-      display: block;
-    }
-  }
-  .lg\:inline-block {
-    @media (width >= 64rem) {
-      display: inline-block;
-    }
-  }
-  .lg\:table-cell {
-    @media (width >= 64rem) {
-      display: table-cell;
-    }
-  }
   .lg\:grid-cols-2 {
     @media (width >= 64rem) {
       grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -9486,26 +9447,11 @@
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
   }
-  .xl\:visible {
-    @media (width >= 80rem) {
-      visibility: visible;
-    }
-  }
   .xl\:table-cell {
     @media (width >= 80rem) {
       display: table-cell;
     }
   }
-  .xl\:grid-cols-2 {
-    @media (width >= 80rem) {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-  }
-  .xl\:grid-cols-3 {
-    @media (width >= 80rem) {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-  }
   .\32 xl\:table-cell {
     @media (width >= 96rem) {
       display: table-cell;

Sources/DatabaseClient/Errors.swift

@@ -9,4 +9,6 @@ public struct ValidationError: Error {
   }
 }
 
-public struct NotFoundError: Error {}
+public struct NotFoundError: Error {
+  public init() {}
+}

Sources/DatabaseClient/Rooms.swift

@@ -9,6 +9,8 @@ extension DatabaseClient {
   public struct Rooms: Sendable {
     public var create: @Sendable (Room.Create) async throws -> Room
     public var delete: @Sendable (Room.ID) async throws -> Void
+    public var deleteRectangularSize:
+      @Sendable (Room.ID, DuctSizing.RectangularDuct.ID) async throws -> Room
     public var get: @Sendable (Room.ID) async throws -> Room?
     public var fetch: @Sendable (Project.ID) async throws -> [Room]
     public var update: @Sendable (Room.ID, Room.Update) async throws -> Room
@@ -31,6 +33,18 @@ extension DatabaseClient.Rooms: TestDependencyKey {
         }
         try await model.delete(on: database)
       },
+      deleteRectangularSize: { roomID, rectangularDuctID in
+        guard let model = try await RoomModel.find(roomID, on: database) else {
+          throw NotFoundError()
+        }
+        model.rectangularSizes?.removeAll {
+          $0.id == rectangularDuctID
+        }
+        if model.hasChanges {
+          try await model.save(on: database)
+        }
+        return try model.toDTO()
+      },
       get: { id in
         try await RoomModel.find(id, on: database).map { try $0.toDTO() }
       },

Sources/ManualDClient/Helpers.swift

@@ -4,6 +4,7 @@ import ManualDCore
 extension Room {
 
   var heatingLoadPerRegister: Double {
+
     heatingLoad / Double(registerCount)
   }
 

Sources/ManualDClient/Live.swift

@@ -25,7 +25,7 @@ extension ManualDClient: DependencyKey {
         throw ManualDError(message: "Total Effective Length should be greater than 0.")
       }
 
-      let totalComponentLosses = request.componentPressureLosses.totalLosses
+      let totalComponentLosses = request.componentPressureLosses.totalComponentPressureLoss
       let availableStaticPressure = request.externalStaticPressure - totalComponentLosses
       let frictionRate = availableStaticPressure * 100.0 / Double(request.totalEffectiveLength)
       return .init(availableStaticPressure: availableStaticPressure, frictionRate: frictionRate)

Sources/ManualDClient/ManualDClient.swift

@@ -130,12 +130,12 @@ extension ManualDClient {
   public struct FrictionRateRequest: Codable, Equatable, Sendable {
 
     public let externalStaticPressure: Double
-    public let componentPressureLosses: ComponentPressureLosses
+    public let componentPressureLosses: [ComponentPressureLoss]
     public let totalEffectiveLength: Int
 
     public init(
       externalStaticPressure: Double,
-      componentPressureLosses: ComponentPressureLosses,
+      componentPressureLosses: [ComponentPressureLoss],
       totalEffectiveLength: Int
     ) {
       self.externalStaticPressure = externalStaticPressure

Sources/ManualDCore/DuctSizing.swift

@@ -3,15 +3,18 @@ import Foundation
 
 public enum DuctSizing {
 
-  public struct RectangularDuct: Codable, Equatable, Sendable {
+  public struct RectangularDuct: Codable, Equatable, Identifiable, Sendable {
 
+    public let id: UUID
     public let register: Int?
     public let height: Int
 
     public init(
+      id: UUID = .init(),
       register: Int? = nil,
       height: Int,
     ) {
+      self.id = id
       self.register = register
       self.height = height
     }

Sources/ManualDCore/Routes/ViewRoute.swift

@@ -677,6 +677,7 @@ extension SiteRoute.View.ProjectRoute {
 
   public enum DuctSizingRoute: Equatable, Sendable {
     case index
+    case deleteRectangularSize(Room.ID, DuctSizing.RectangularDuct.ID)
     case roomRectangularForm(Room.ID, RoomRectangularForm)
 
     static let rootPath = "duct-sizing"
@@ -686,6 +687,17 @@ extension SiteRoute.View.ProjectRoute {
         Path { rootPath }
         Method.get
       }
+      Route(.case(Self.deleteRectangularSize)) {
+        Path {
+          rootPath
+          "room"
+          Room.ID.parser()
+        }
+        Method.delete
+        Query {
+          Field("rectangularSize") { DuctSizing.RectangularDuct.ID.parser() }
+        }
+      }
       Route(.case(Self.roomRectangularForm)) {
         Path {
           rootPath
@@ -695,6 +707,9 @@ extension SiteRoute.View.ProjectRoute {
         Method.post
         Body {
           FormData {
+            Optionally {
+              Field("id") { DuctSizing.RectangularDuct.ID.parser() }
+            }
             Field("register") { Int.parser() }
             Field("height") { Int.parser() }
           }
@@ -704,6 +719,7 @@ extension SiteRoute.View.ProjectRoute {
     }
 
     public struct RoomRectangularForm: Equatable, Sendable {
+      public let id: DuctSizing.RectangularDuct.ID?
       public let register: Int
       public let height: Int
     }

Sources/Styleguide/Buttons.swift

@@ -65,7 +65,7 @@ public struct EditButton: HTML, Sendable {
   }
 
   public var body: some HTML<HTMLTag.button> {
-    button(.class("btn btn-success btn-circle dark:text-white"), .type(type)) {
+    button(.class("btn btn-success btn-circle"), .type(type)) {
       div(.class("flex")) {
         if let title {
           span(.class("pe-2")) { title }
@@ -94,7 +94,7 @@ public struct TrashButton: HTML, Sendable {
   public var body: some HTML<HTMLTag.button> {
     button(
       .type(.button),
-      .class("btn btn-error btn-circle dark:text-white")
+      .class("btn btn-error")
     ) {
       SVG(.trash)
     }

Sources/Styleguide/ElementaryExtensions.swift

@@ -1,4 +1,5 @@
 import Elementary
+import Foundation
 import ManualDCore
 
 extension HTMLAttribute where Tag: HTMLTrait.Attributes.href {
@@ -28,6 +29,10 @@ extension HTMLAttribute where Tag == HTMLTag.input {
   public static func value(_ double: Double?) -> Self {
     value(double == nil ? "" : "\(double!)")
   }
+
+  public static func value(_ uuid: UUID?) -> Self {
+    value(uuid?.uuidString ?? "")
+  }
 }
 
 extension HTMLAttribute where Tag == HTMLTag.button {

Sources/Styleguide/ResultView.swift

@@ -0,0 +1,89 @@
+import Elementary
+import Foundation
+
+public struct ResultView<
+  V: Sendable,
+  E: Error,
+  ValueView: HTML,
+  ErrorView: HTML
+>: HTML {
+
+  let onSuccess: @Sendable (V) -> ValueView
+  let onError: @Sendable (E) -> ErrorView
+  let result: Result<V, E>
+
+  public init(
+    result: Result<V, E>,
+    @HTMLBuilder onSuccess: @escaping @Sendable (V) -> ValueView,
+    @HTMLBuilder onError: @escaping @Sendable (E) -> ErrorView
+  ) {
+    self.result = result
+    self.onError = onError
+    self.onSuccess = onSuccess
+  }
+
+  public var body: some HTML {
+    switch result {
+    case .success(let value):
+      onSuccess(value)
+    case .failure(let error):
+      onError(error)
+    }
+  }
+}
+
+extension ResultView {
+
+  public init(
+    result: Result<V, E>,
+    @HTMLBuilder onSuccess: @escaping @Sendable (V) -> ValueView
+  ) where ErrorView == Styleguide.ErrorView<E> {
+    self.init(result: result, onSuccess: onSuccess) { error in
+      Styleguide.ErrorView(error: error)
+    }
+  }
+
+  public init(
+    catching: @escaping @Sendable () async throws(E) -> V,
+    @HTMLBuilder onSuccess: @escaping @Sendable (V) -> ValueView
+  ) async where ErrorView == Styleguide.ErrorView<E> {
+    await self.init(
+      result: .init(catching: catching),
+      onSuccess: onSuccess
+    ) { error in
+      Styleguide.ErrorView(error: error)
+    }
+  }
+
+  public init(
+    catching: @escaping @Sendable () async throws(E) -> V,
+  ) async where ErrorView == Styleguide.ErrorView<E>, V == Void, ValueView == EmptyHTML {
+    await self.init(
+      result: .init(catching: catching),
+      onSuccess: { EmptyHTML() }
+    ) { error in
+      Styleguide.ErrorView(error: error)
+    }
+  }
+}
+
+extension ResultView: Sendable where Error: Sendable, ValueView: Sendable, ErrorView: Sendable {}
+
+public struct ErrorView<E: Error>: HTML, Sendable where Error: Sendable {
+
+  let error: E
+
+  public init(error: E) {
+    self.error = error
+  }
+
+  public var body: some HTML<HTMLTag.div> {
+    div {
+      h1(.class("text-2xl font-bold text-error")) { "Oops: Error" }
+      p {
+        "\(error)"
+      }
+    }
+  }
+
+}

Sources/Styleguide/Tooltip.swift

@@ -0,0 +1,37 @@
+import Elementary
+
+public struct Tooltip<Inner: HTML & Sendable>: HTML, Sendable {
+
+  let tooltip: String
+  let position: TooltipPosition
+  let inner: Inner
+
+  public init(
+    _ tooltip: String,
+    position: TooltipPosition = .default,
+    @HTMLBuilder inner: () -> Inner
+  ) {
+    self.tooltip = tooltip
+    self.position = position
+    self.inner = inner()
+  }
+
+  public var body: some HTML<HTMLTag.div> {
+    div(
+      .class("tooltip tooltip-\(position.rawValue)"),
+      .data("tip", value: tooltip)
+    ) {
+      inner
+    }
+  }
+}
+
+public enum TooltipPosition: String, CaseIterable, Sendable {
+
+  public static let `default` = Self.left
+
+  case bottom
+  case left
+  case right
+  case top
+}

Sources/ViewController/Extensions/DatabaseExtensions.swift

@@ -1,5 +1,7 @@
 import DatabaseClient
+import Dependencies
 import Fluent
+import ManualDClient
 import ManualDCore
 import Vapor
 
@@ -24,6 +26,16 @@ extension DatabaseClient.Projects {
 
 extension DatabaseClient {
 
+  func calculateDuctSizes(projectID: Project.ID) async throws -> [DuctSizing.RoomContainer] {
+    @Dependency(\.manualD) var manualD
+
+    return try await manualD.calculate(
+      rooms: rooms.fetch(projectID),
+      designFrictionRateResult: designFrictionRate(projectID: projectID),
+      projectSHR: projects.getSensibleHeatRatio(projectID)
+    )
+  }
+
   func designFrictionRate(
     projectID: Project.ID
   ) async throws -> (EquipmentInfo, EffectiveLength.MaxContainer, Double)? {

Sources/ViewController/Interface.swift

@@ -55,7 +55,7 @@ extension ViewController: DependencyKey {
   // FIX: Fix.
   public static let liveValue = Self(
     view: { request in
-      try await request.render()
+      await request.render()
     }
   )
 }

Sources/ViewController/Live.swift

@@ -3,10 +3,11 @@ import Dependencies
 import Elementary
 import Foundation
 import ManualDCore
+import Styleguide
 
 extension ViewController.Request {
 
-  func render() async throws -> AnySendableHTML {
+  func render() async -> AnySendableHTML {
 
     @Dependency(\.database) var database
 
@@ -22,9 +23,13 @@ extension ViewController.Request {
           LoginForm(next: next)
         }
       case .submit(let login):
-        let _ = try await authenticate(login)
+        // let _ = try await authenticate(login)
-        return view {
+        return await view {
-          LoggedIn(next: login.next)
+          await ResultView {
+            try await authenticate(login)
+          } onSuccess: { _ in
+            LoggedIn(next: login.next)
+          }
         }
       }
     case .signup(let route):
@@ -35,14 +40,20 @@ extension ViewController.Request {
         }
       case .submit(let request):
         // Create a new user and log them in.
-        let user = try await createAndAuthenticate(request)
+        return await view {
-        let projects = try await database.projects.fetch(user.id, .init(page: 1, per: 25))
+          await ResultView {
-        return view {
+            let user = try await createAndAuthenticate(request)
-          ProjectsTable(userID: user.id, projects: projects)
+            return (
+              user.id,
+              try await database.projects.fetch(user.id, .init(page: 1, per: 25))
+            )
+          } onSuccess: { (userID, projects) in
+            ProjectsTable(userID: userID, projects: projects)
+          }
         }
       }
     case .project(let route):
-      return try await route.renderView(on: self)
+      return await route.renderView(on: self)
     default:
       // FIX: FIX
       return _render(isHtmxRequest: false) {
@@ -59,6 +70,14 @@ extension ViewController.Request {
     }
   }
 
+  func view<C: HTML>(
+    @HTMLBuilder inner: () async -> C
+  ) async -> AnySendableHTML where C: Sendable {
+    await _render(isHtmxRequest: isHtmxRequest, showSidebar: showSidebar) {
+      await inner()
+    }
+  }
+
   var showSidebar: Bool {
     switch route {
     case .login, .signup, .project(.page):
@@ -71,43 +90,70 @@ extension ViewController.Request {
 
 extension SiteRoute.View.ProjectRoute {
 
-  func renderView(on request: ViewController.Request) async throws -> AnySendableHTML {
+  func renderView(on request: ViewController.Request) async -> AnySendableHTML {
     @Dependency(\.database) var database
-    let user = try request.currentUser()
+    // let user = try request.currentUser()
 
     switch self {
     case .index:
-      let projects = try await database.projects.fetchPage(userID: user.id)
+      return await request.view {
-      return request.view {
+        await ResultView {
-        ProjectsTable(userID: user.id, projects: projects)
+          let user = try request.currentUser()
+          return try await (
+            user.id,
+            database.projects.fetchPage(userID: user.id)
+          )
+
+        } onSuccess: { (userID, projects) in
+          ProjectsTable(userID: userID, projects: projects)
+        }
       }
     case .page(let page):
-      let projects = try await database.projects.fetch(user.id, page)
+      return await ResultView {
-      return ProjectsTable(userID: user.id, projects: projects)
+        let user = try request.currentUser()
+        return try await (
+          user.id,
+          database.projects.fetch(user.id, page)
+        )
+      } onSuccess: { (userID, projects) in
+        ProjectsTable(userID: userID, projects: projects)
+      }
 
     case .form(let id, let dismiss):
-      request.logger.debug("Project form: \(id != nil ? "Fetching project for: \(id!)" : "N/A")")
+      return await ResultView {
-      var project: Project? = nil
+        var project: Project? = nil
-      if let id, dismiss == false {
+        if let id, dismiss == false {
-        project = try await database.projects.get(id)
+          project = try await database.projects.get(id)
+        }
+        return project
+      } onSuccess: { project in
+        ProjectForm(dismiss: dismiss, project: project)
       }
-      request.logger.debug(
-        project == nil ? "No project found" : "Showing form for existing project"
-      )
-      return ProjectForm(dismiss: dismiss, project: project)
 
     case .create(let form):
-      let project = try await database.projects.create(user.id, form)
+      return await ResultView {
-      try await database.componentLoss.createDefaults(projectID: project.id)
+        let user = try request.currentUser()
-      return ProjectView(projectID: project.id, activeTab: .rooms)
+        let project = try await database.projects.create(user.id, form)
+        try await database.componentLoss.createDefaults(projectID: project.id)
+        return project.id
+
+      } onSuccess: { projectID in
+        ProjectView(projectID: projectID, activeTab: .rooms)
+      }
 
     case .delete(let id):
-      try await database.projects.delete(id)
+      return await ResultView {
-      return EmptyHTML()
+        try await database.projects.delete(id)
+      } onSuccess: {
+        EmptyHTML()
+      }
 
     case .update(let id, let form):
-      let project = try await database.projects.update(id, form)
+      return await ResultView {
-      return ProjectView(projectID: project.id, activeTab: .project)
+        try await database.projects.update(id, form).id
+      } onSuccess: { projectID in
+        return ProjectView(projectID: projectID, activeTab: .project)
+      }
 
     case .detail(let projectID, let route):
       switch route {
@@ -116,17 +162,17 @@ extension SiteRoute.View.ProjectRoute {
           ProjectView(projectID: projectID, activeTab: tab)
         }
       case .componentLoss(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return await route.renderView(on: request, projectID: projectID)
       case .ductSizing(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return await route.renderView(on: request, projectID: projectID)
       case .equipment(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return await route.renderView(on: request, projectID: projectID)
       case .equivalentLength(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return await route.renderView(on: request, projectID: projectID)
       case .frictionRate(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return route.renderView(on: request, projectID: projectID)
       case .rooms(let route):
-        return try await route.renderView(on: request, projectID: projectID)
+        return await route.renderView(on: request, projectID: projectID)
       }
     }
 
@@ -138,22 +184,34 @@ extension SiteRoute.View.ProjectRoute.EquipmentInfoRoute {
   func renderView(
     on request: ViewController.Request,
     projectID: Project.ID
-  ) async throws -> AnySendableHTML {
+  ) async -> AnySendableHTML {
     @Dependency(\.database) var database
 
     switch self {
     case .index:
-      let equipment = try await database.equipment.fetch(projectID)
+      return await ResultView {
-      return EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+        try await database.equipment.fetch(projectID)
+      } onSuccess: { equipment in
+        EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+      }
     case .form(let dismiss):
-      let equipment = try await database.equipment.fetch(projectID)
+      return await ResultView {
-      return EquipmentInfoForm(dismiss: dismiss, projectID: projectID, equipmentInfo: equipment)
+        try await database.equipment.fetch(projectID)
+      } onSuccess: { equipment in
+        EquipmentInfoForm(dismiss: dismiss, projectID: projectID, equipmentInfo: equipment)
+      }
     case .submit(let form):
-      let equipment = try await database.equipment.create(form)
+      return await ResultView {
-      return EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+        try await database.equipment.create(form)
+      } onSuccess: { equipment in
+        EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+      }
     case .update(let id, let updates):
-      let equipment = try await database.equipment.update(id, updates)
+      return await ResultView {
-      return EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+        try await database.equipment.update(id, updates)
+      } onSuccess: { equipment in
+        EquipmentInfoView(equipmentInfo: equipment, projectID: projectID)
+      }
     }
   }
 }
@@ -162,21 +220,26 @@ extension SiteRoute.View.ProjectRoute.RoomRoute {
   func renderView(
     on request: ViewController.Request,
     projectID: Project.ID
-  ) async throws -> AnySendableHTML {
+  ) async -> AnySendableHTML {
     @Dependency(\.database) var database
 
     switch self {
 
     case .delete(let id):
-      try await database.rooms.delete(id)
+      return await ResultView {
-      return EmptyHTML()
+        try await database.rooms.delete(id)
+      }
 
     case .form(let id, let dismiss):
-      var room: Room? = nil
+      return await ResultView {
-      if let id, dismiss == false {
+        var room: Room? = nil
-        room = try await database.rooms.get(id)
+        if let id, dismiss == false {
+          room = try await database.rooms.get(id)
+        }
+        return room
+      } onSuccess: { room in
+        RoomForm(dismiss: dismiss, projectID: projectID, room: room)
       }
-      return RoomForm(dismiss: dismiss, projectID: projectID, room: room)
 
     case .index:
       return request.view {
@@ -184,40 +247,46 @@ extension SiteRoute.View.ProjectRoute.RoomRoute {
       }
 
     case .submit(let form):
-      request.logger.debug("New room form submitted.")
+      return await request.view {
-      // FIX: Just return a room row??
+        await ResultView {
-      let _ = try await database.rooms.create(form)
+          request.logger.debug("New room form submitted.")
-      return request.view {
+          // FIX: Just return a room row??
-        ProjectView(projectID: projectID, activeTab: .rooms)
+          let _ = try await database.rooms.create(form)
+        } onSuccess: {
+          ProjectView(projectID: projectID, activeTab: .rooms)
+        }
       }
 
     case .update(let id, let form):
-      let _ = try await database.rooms.update(id, form)
+      return await ResultView {
-      return ProjectView(projectID: projectID, activeTab: .rooms)
+        let _ = try await database.rooms.update(id, form)
+      } onSuccess: {
+        ProjectView(projectID: projectID, activeTab: .rooms)
+      }
 
     case .updateSensibleHeatRatio(let form):
-      let _ = try await database.projects.update(
+      return await request.view {
-        form.projectID,
+        await ResultView {
-        .init(sensibleHeatRatio: form.sensibleHeatRatio)
+          let _ = try await database.projects.update(
-      )
+            form.projectID,
-      return request.view {
+            .init(sensibleHeatRatio: form.sensibleHeatRatio)
-        ProjectView(projectID: projectID, activeTab: .rooms)
+          )
+        } onSuccess: {
+          ProjectView(projectID: projectID, activeTab: .rooms)
+        }
       }
     }
   }
 }
 
 extension SiteRoute.View.ProjectRoute.FrictionRateRoute {
-  func renderView(on request: ViewController.Request, projectID: Project.ID) async throws
+  func renderView(
-    -> AnySendableHTML
+    on request: ViewController.Request,
-  {
+    projectID: Project.ID
-    @Dependency(\.database) var database
+  ) -> AnySendableHTML {
 
     switch self {
     case .index:
-      // let equipment = try await database.equipment.fetch(projectID)
-      // let componentLosses = try await database.componentLoss.fetch(projectID)
-
       return request.view {
         ProjectView(projectID: projectID, activeTab: .frictionRate)
       }
@@ -240,21 +309,31 @@ extension SiteRoute.View.ProjectRoute.ComponentLossRoute {
   func renderView(
     on request: ViewController.Request,
     projectID: Project.ID
-  ) async throws -> AnySendableHTML {
+  ) async -> AnySendableHTML {
     @Dependency(\.database) var database
 
     switch self {
     case .index:
       return EmptyHTML()
     case .delete(let id):
-      _ = try await database.componentLoss.delete(id)
+      return await ResultView {
-      return EmptyHTML()
+        _ = try await database.componentLoss.delete(id)
+      } onSuccess: {
+        EmptyHTML()
+      }
+    // return EmptyHTML()
     case .submit(let form):
-      _ = try await database.componentLoss.create(form)
+      return await ResultView {
-      return ProjectView(projectID: projectID, activeTab: .frictionRate)
+        _ = try await database.componentLoss.create(form)
+      } onSuccess: {
+        ProjectView(projectID: projectID, activeTab: .frictionRate)
+      }
     case .update(let id, let form):
-      _ = try await database.componentLoss.update(id, form)
+      return await ResultView {
-      return ProjectView(projectID: projectID, activeTab: .frictionRate)
+        _ = try await database.componentLoss.update(id, form)
+      } onSuccess: {
+        ProjectView(projectID: projectID, activeTab: .frictionRate)
+      }
     }
   }
 }
@@ -275,14 +354,15 @@ extension SiteRoute.View.ProjectRoute.EquivalentLengthRoute {
   func renderView(
     on request: ViewController.Request,
     projectID: Project.ID
-  ) async throws -> AnySendableHTML {
+  ) async -> AnySendableHTML {
     @Dependency(\.database) var database
 
     switch self {
 
     case .delete(let id):
-      try await database.effectiveLength.delete(id)
+      return await ResultView {
-      return EmptyHTML()
+        try await database.effectiveLength.delete(id)
+      }
 
     case .index:
       return request.view {
@@ -301,35 +381,50 @@ extension SiteRoute.View.ProjectRoute.EquivalentLengthRoute {
       }
 
     case .update(let id, let form):
-      _ = try await database.effectiveLength.update(id, .init(form: form, projectID: projectID))
+      return await ResultView {
-      return ProjectView(projectID: projectID, activeTab: .equivalentLength)
+        _ = try await database.effectiveLength.update(id, .init(form: form, projectID: projectID))
+      } onSuccess: {
+        ProjectView(projectID: projectID, activeTab: .equivalentLength)
+      }
 
     case .submit(let step):
       switch step {
       case .one(let stepOne):
-        var effectiveLength: EffectiveLength? = nil
+        return await ResultView {
-        if let id = stepOne.id {
+          var effectiveLength: EffectiveLength? = nil
-          effectiveLength = try await database.effectiveLength.get(id)
+          if let id = stepOne.id {
+            effectiveLength = try await database.effectiveLength.get(id)
+          }
+          return effectiveLength
+        } onSuccess: { effectiveLength in
+          EffectiveLengthForm.StepTwo(
+            projectID: projectID,
+            stepOne: stepOne,
+            effectiveLength: effectiveLength
+          )
         }
-        return EffectiveLengthForm.StepTwo(
-          projectID: projectID,
-          stepOne: stepOne,
-          effectiveLength: effectiveLength
-        )
       case .two(let stepTwo):
-        request.logger.debug("ViewController: Got step two...")
+        return await ResultView {
-        var effectiveLength: EffectiveLength? = nil
+          request.logger.debug("ViewController: Got step two...")
-        if let id = stepTwo.id {
+          var effectiveLength: EffectiveLength? = nil
-          effectiveLength = try await database.effectiveLength.get(id)
+          if let id = stepTwo.id {
+            effectiveLength = try await database.effectiveLength.get(id)
+          }
+          return effectiveLength
+        } onSuccess: { effectiveLength in
+          return EffectiveLengthForm.StepThree(
+            projectID: projectID, effectiveLength: effectiveLength, stepTwo: stepTwo
+          )
         }
-        return EffectiveLengthForm.StepThree(
-          projectID: projectID, effectiveLength: effectiveLength, stepTwo: stepTwo
-        )
       case .three(let stepThree):
-        request.logger.debug("ViewController: Got step three: \(stepThree)")
+        return await ResultView {
-        try stepThree.validate()
+          request.logger.debug("ViewController: Got step three: \(stepThree)")
-        _ = try await database.effectiveLength.create(.init(form: stepThree, projectID: projectID))
+          try stepThree.validate()
-        return ProjectView(projectID: projectID, activeTab: .equivalentLength)
+          _ = try await database.effectiveLength.create(
+            .init(form: stepThree, projectID: projectID))
+        } onSuccess: {
+          ProjectView(projectID: projectID, activeTab: .equivalentLength)
+        }
 
       }
     }
@@ -339,9 +434,10 @@ extension SiteRoute.View.ProjectRoute.EquivalentLengthRoute {
 
 extension SiteRoute.View.ProjectRoute.DuctSizingRoute {
 
-  func renderView(on request: ViewController.Request, projectID: Project.ID) async throws
+  func renderView(
-    -> AnySendableHTML
+    on request: ViewController.Request,
-  {
+    projectID: Project.ID
+  ) async -> AnySendableHTML {
     @Dependency(\.database) var database
     @Dependency(\.manualD) var manualD
 
@@ -350,23 +446,33 @@ extension SiteRoute.View.ProjectRoute.DuctSizingRoute {
       return request.view {
         ProjectView(projectID: projectID, activeTab: .ductSizing, logger: request.logger)
       }
+
+    case .deleteRectangularSize(let roomID, let rectangularSizeID):
+      return await ResultView {
+        let room = try await database.rooms.deleteRectangularSize(roomID, rectangularSizeID)
+        return try await database.calculateDuctSizes(projectID: projectID)
+          .filter({ $0.roomID == room.id })
+          .first!
+      } onSuccess: { container in
+        DuctSizingView.RoomRow(projectID: projectID, room: container)
+      }
+
     case .roomRectangularForm(let roomID, let form):
-      let _ = try await database.rooms.update(
+      return await ResultView {
-        roomID,
+        let room = try await database.rooms.update(
-        .init(rectangularSizes: [.init(register: form.register, height: form.height)])
+          roomID,
-      )
+          .init(
-      // request.logger.debug("Got room rectangular form: \(roomID)")
+            rectangularSizes: [
-      //
+              .init(id: form.id ?? .init(), register: form.register, height: form.height)
-      // let containers = try await manualD.calculate(
+            ]
-      //   rooms: [room],
+          )
-      //   designFrictionRateResult: database.designFrictionRate(projectID: projectID),
+        )
-      //   projectSHR: database.projects.getSensibleHeatRatio(projectID)
+        return try await database.calculateDuctSizes(projectID: projectID)
-      // )
+          .filter({ $0.roomID == room.id })
-      // request.logger.debug("Room Containers: \(containers)")
+          .first!
-      // let container = containers.first(where: { $0.roomName == "\(room.name)-\(form.register)" })!
+      } onSuccess: { container in
-      // request.logger.debug("Room Container: \(container)")
+        DuctSizingView.RoomRow(projectID: projectID, room: container)
-      // return DuctSizingView.RoomRow(projectID: projectID, room: container)
+      }
-      return ProjectView(projectID: projectID, activeTab: .ductSizing, logger: request.logger)
     }
   }
 }
@@ -384,6 +490,19 @@ private func _render<C: HTML>(
   return MainPage { inner }
 }
 
+private func _render<C: HTML>(
+  isHtmxRequest: Bool,
+  active activeTab: SiteRoute.View.ProjectRoute.DetailRoute.Tab = .rooms,
+  showSidebar: Bool = true,
+  @HTMLBuilder inner: () async -> C
+) async -> AnySendableHTML where C: Sendable {
+  let inner = await inner()
+  if isHtmxRequest {
+    return inner
+  }
+  return MainPage { inner }
+}
+
 private func _render<C: HTML>(
   isHtmxRequest: Bool,
   active activeTab: SiteRoute.View.ProjectRoute.DetailRoute.Tab = .rooms,

Sources/ViewController/Views/ComponentLoss/ComponentLossesView.swift

@@ -31,10 +31,13 @@ struct ComponentPressureLossesView: HTML, Sendable {
             span(.class("text-sm italic")) { "Total" }
           }
         }
-        PlusButton()
+        Tooltip("Add Component Loss") {
-          .attributes(
+          PlusButton()
-            .showModal(id: ComponentLossForm.id())
+            .attributes(
-          )
+              .class("btn-ghost text-2xl"),
+              .showModal(id: ComponentLossForm.id())
+            )
+        }
       }
 
       table(.class("table table-zebra")) {
@@ -65,24 +68,28 @@ struct ComponentPressureLossesView: HTML, Sendable {
         td { Number(row.value) }
         td {
           div(.class("flex join items-end justify-end mx-auto")) {
-            TrashButton()
+            Tooltip("Delete", position: .bottom) {
-              .attributes(
+              TrashButton()
-                .class("join-item"),
+                .attributes(
-                .hx.delete(
+                  .class("join-item btn-ghost"),
-                  route: .project(
+                  .hx.delete(
-                    .detail(row.projectID, .componentLoss(.delete(row.id)))
+                    route: .project(
-                  )
+                      .detail(row.projectID, .componentLoss(.delete(row.id)))
-                ),
+                    )
-                .hx.target("body"),
+                  ),
-                .hx.swap(.outerHTML),
+                  .hx.target("body"),
-                .hx.confirm("Are your sure?")
+                  .hx.swap(.outerHTML),
+                  .hx.confirm("Are your sure?")
 
-              )
+                )
-            EditButton()
+            }
-              .attributes(
+            Tooltip("Edit", position: .bottom) {
-                .class("join-item"),
+              EditButton()
-                .showModal(id: ComponentLossForm.id(row))
+                .attributes(
-              )
+                  .class("join-item btn-ghost"),
+                  .showModal(id: ComponentLossForm.id(row))
+                )
+            }
           }
 
           ComponentLossForm(dismiss: true, projectID: row.projectID, componentLoss: row)

Sources/ViewController/Views/DuctSizing/DuctSizingView.swift

@@ -7,7 +7,9 @@ import Styleguide
 
 struct DuctSizingView: HTML, Sendable {
 
-  let projectID: Project.ID
+  @Environment(ProjectViewValue.$projectID) var projectID
+
+  // let projectID: Project.ID
   let rooms: [DuctSizing.RoomContainer]
 
   var body: some HTML {
@@ -42,9 +44,9 @@ struct DuctSizingView: HTML, Sendable {
               th(.class("hidden xl:table-cell")) { "Round Size" }
               th { "Velocity" }
               th { "Final Size" }
-              th { "Height" }
-              th { "Width" }
               th { "Flex Size" }
+              th { "Width" }
+              th { "Height" }
             }
           }
           tbody {
@@ -70,7 +72,7 @@ struct DuctSizingView: HTML, Sendable {
     }
 
     var body: some HTML<HTMLTag.tr> {
-      tr(.class("text-lg"), .id(room.roomID.idString)) {
+      tr(.class("text-lg items-baseline"), .id(room.roomID.idString)) {
         td { room.registerID }
         td { room.roomName }
         td { Number(room.heatingLoad, digits: 0) }
@@ -89,25 +91,8 @@ struct DuctSizingView: HTML, Sendable {
             .attributes(.class("badge badge-outline badge-secondary text-xl  font-bold"))
         }
         td {
-          form(
+          Number(room.flexSize)
-            .hx.post(route),
+            .attributes(.class("badge badge-outline badge-primary text-xl  font-bold"))
-            .hx.target("body"),
-            .hx.swap(.outerHTML)
-            // .hx.trigger(
-            //   .event(.change).from("#rectangularSize_\(room.roomID.idString)")
-            // )
-          ) {
-            input(.class("hidden"), .name("register"), .value("\(room.roomName.last!)"))
-            Row {
-              Input(
-                id: "height",
-                name: "height",
-                placeholder: "Height"
-              )
-              .attributes(.type(.number), .min("0"), .value(room.rectangularSize?.height))
-              SubmitButton()
-            }
-          }
         }
         td {
           if let width = room.rectangularWidth {
@@ -115,8 +100,44 @@ struct DuctSizingView: HTML, Sendable {
           }
         }
         td {
-          Number(room.flexSize)
+          div(.class("flex justify-between items-center space-x-4")) {
-            .attributes(.class("badge badge-outline badge-primary text-xl  font-bold"))
+            div(.id("height_\(room.roomID.idString)"), .class("h-full my-auto")) {
+              if let height = room.rectangularSize?.height {
+                Number(height)
+              }
+            }
+            div {
+              div(.class("join")) {
+                // FIX: Delete rectangular size from room.
+                TrashButton()
+                  .attributes(.class("join-item btn-ghost"))
+                  .attributes(
+                    .hx.delete(
+                      route: .project(
+                        .detail(
+                          projectID,
+                          .ductSizing(
+                            .deleteRectangularSize(
+                              room.roomID,
+                              room.rectangularSize?.id ?? .init())
+                          )
+                        )
+                      )
+                    ),
+                    .hx.target("closest tr"),
+                    .hx.swap(.outerHTML),
+                    when: room.rectangularSize != nil
+                  )
+
+                EditButton()
+                  .attributes(
+                    .class("join-item btn-ghost text-success hover:text-white"),
+                    .showModal(id: RectangularSizeForm.id(room))
+                  )
+              }
+            }
+          }
+          RectangularSizeForm(projectID: projectID, room: room)
         }
       }
     }

Sources/ViewController/Views/DuctSizing/RectangularSizeForm.swift

@@ -0,0 +1,92 @@
+import Elementary
+import ElementaryHTMX
+import ManualDCore
+import Styleguide
+
+struct RectangularSizeForm: HTML, Sendable {
+
+  static func id(_ roomID: Room.ID? = nil) -> String {
+    let base = "rectangularSizeForm"
+    guard let roomID else { return base }
+    return "\(base)_\(roomID.idString)"
+  }
+
+  static func id(_ room: DuctSizing.RoomContainer) -> String {
+    return id(room.roomID)
+  }
+
+  let projectID: Project.ID
+  let roomID: Room.ID
+  let rectangularSizeID: DuctSizing.RectangularDuct.ID?
+  let register: Int
+  let height: Int?
+  let dismiss: Bool
+
+  init(
+    projectID: Project.ID,
+    roomID: Room.ID,
+    rectangularSizeID: DuctSizing.RectangularDuct.ID? = nil,
+    register: Int,
+    height: Int? = nil,
+    dismiss: Bool = true
+  ) {
+    self.projectID = projectID
+    self.roomID = roomID
+    self.rectangularSizeID = rectangularSizeID
+    self.register = register
+    self.height = height
+    self.dismiss = dismiss
+  }
+
+  init(
+    projectID: Project.ID,
+    room: DuctSizing.RoomContainer,
+    dismiss: Bool = true
+  ) {
+    let register =
+      room.rectangularSize?.register
+      ?? (Int("\(room.roomName.last!)") ?? 1)
+
+    self.init(
+      projectID: projectID,
+      roomID: room.roomID,
+      rectangularSizeID: room.rectangularSize?.id,
+      register: register,
+      height: room.rectangularSize?.height,
+      dismiss: dismiss
+    )
+  }
+
+  var route: String {
+    SiteRoute.View.router.path(
+      for: .project(.detail(projectID, .ductSizing(.index)))
+    )
+    .appendingPath("room")
+    .appendingPath(roomID)
+
+  }
+
+  var body: some HTML {
+    ModalForm(id: Self.id(roomID), dismiss: dismiss) {
+
+      h1(.class("text-lg pb-6")) { "Rectangular Size" }
+
+      form(
+        .class("space-y-4"),
+        .hx.post(route),
+        .hx.target("closest tr"),
+        .hx.swap(.outerHTML)
+      ) {
+        input(.class("hidden"), .name("register"), .value(register))
+        input(.class("hidden"), .name("id"), .value(rectangularSizeID))
+
+        Input(id: "height", placeholder: "Height")
+          .attributes(.type(.number), .min("0"), .value(height), .required, .autofocus)
+
+        SubmitButton()
+          .attributes(.class("btn-block"))
+      }
+
+    }
+  }
+}

Sources/ViewController/Views/EffectiveLength/EffectiveLengthForm.swift

@@ -3,16 +3,8 @@ import ElementaryHTMX
 import ManualDCore
 import Styleguide
 
-// TODO: May need a multi-step form were the the effective length type is
-//       determined before groups selections are made in order to use the
-//       appropriate select field values when the type is supply vs. return.
-//       Currently when the select field is changed it doesn't change the group
-//       I can get it to add a new one.
-
 // TODO: Add back buttons / capability??
 
-// TODO: Add patch / update capability
-
 struct EffectiveLengthForm: HTML, Sendable {
 
   static func id(_ equivalentLength: EffectiveLength?) -> String {

Sources/ViewController/Views/EffectiveLength/EffectiveLengthsView.swift

@@ -7,7 +7,9 @@ import Styleguide
 
 struct EffectiveLengthsView: HTML, Sendable {
 
-  let projectID: Project.ID
+  @Environment(ProjectViewValue.$projectID) var projectID
+
+  // let projectID: Project.ID
   let effectiveLengths: [EffectiveLength]
 
   var supplies: [EffectiveLength] {

Sources/ViewController/Views/EquipmentInfo/EquipmentInfoView.swift

@@ -15,10 +15,13 @@ struct EquipmentInfoView: HTML, Sendable {
       Row {
         h1(.class("text-2xl font-bold")) { "Equipment Info" }
 
-        EditButton()
+        Tooltip("Edit equipment info") {
-          .attributes(
+          EditButton()
-            .on(.click, "\(EquipmentInfoForm.id).showModal()")
+            .attributes(
-          )
+              .class("btn-ghost"),
+              .showModal(id: EquipmentInfoForm.id)
+            )
+        }
       }
 
       if let equipmentInfo {

Sources/ViewController/Views/FrictionRate/FrictionRateView.swift

@@ -1,4 +1,5 @@
 import Elementary
+import ManualDClient
 import ManualDCore
 import Styleguide
 
@@ -6,23 +7,20 @@ import Styleguide
 
 struct FrictionRateView: HTML, Sendable {
 
+  @Environment(ProjectViewValue.$projectID) var projectID
+
   let equipmentInfo: EquipmentInfo?
   let componentLosses: [ComponentPressureLoss]
   let equivalentLengths: EffectiveLength.MaxContainer
-  let projectID: Project.ID
+  // let projectID: Project.ID
+  let frictionRateResponse: ManualDClient.FrictionRateResponse?
 
   var availableStaticPressure: Double? {
-    guard let staticPressure = equipmentInfo?.staticPressure else {
+    frictionRateResponse?.availableStaticPressure
-      return nil
-    }
-    return staticPressure - componentLosses.totalComponentPressureLoss
   }
 
   var frictionRateDesignValue: Double? {
-    guard let availableStaticPressure, let tel = equivalentLengths.total else {
+    frictionRateResponse?.frictionRate
-      return nil
-    }
-    return (((availableStaticPressure * 100) / tel) * 100) / 100
   }
 
   var badgeColor: String {

Sources/ViewController/Views/Project/ProjectView.swift

@@ -7,6 +7,10 @@ import ManualDClient
 import ManualDCore
 import Styleguide
 
+enum ProjectViewValue {
+  @TaskLocal static var projectID = Project.ID(0)
+}
+
 struct ProjectView: HTML, Sendable {
   @Dependency(\.database) var database
   @Dependency(\.manualD) var manualD
@@ -34,50 +38,65 @@ struct ProjectView: HTML, Sendable {
         div(.class("drawer-content p-4")) {
           label(
             .for("my-drawer-1"),
-            .class("btn btn-square btn-ghost drawer-button size-7")
+            .class("btn btn-square btn-ghost drawer-button size-7 pb-6")
           ) {
             SVG(.sidebarToggle)
           }
           switch self.activeTab {
           case .project:
-            if let project = try await database.projects.get(projectID) {
+            await resultView(projectID) {
-              ProjectDetail(project: project)
+              guard let project = try await database.projects.get(projectID) else {
-            } else {
+                throw NotFoundError()
-              div {
-                "FIX ME!"
               }
+              return project
+            } onSuccess: { project in
+              ProjectDetail(project: project)
             }
           case .rooms:
-            try await RoomsView(
+            await resultView(projectID) {
-              projectID: projectID,
+              try await (
-              rooms: database.rooms.fetch(projectID),
+                database.rooms.fetch(projectID),
-              sensibleHeatRatio: database.projects.getSensibleHeatRatio(projectID)
+                database.projects.getSensibleHeatRatio(projectID)
-            )
+              )
+            } onSuccess: { (rooms, shr) in
+              RoomsView(rooms: rooms, sensibleHeatRatio: shr)
+            }
 
           case .equivalentLength:
-            try await EffectiveLengthsView(
+            await resultView(projectID) {
-              projectID: projectID,
+              try await database.effectiveLength.fetch(projectID)
-              effectiveLengths: database.effectiveLength.fetch(projectID)
+            } onSuccess: {
-            )
+              EffectiveLengthsView(effectiveLengths: $0)
+            }
           case .frictionRate:
-            try await FrictionRateView(
-              equipmentInfo: database.equipment.fetch(projectID),
-              componentLosses: database.componentLoss.fetch(projectID),
-              equivalentLengths: database.effectiveLength.fetchMax(projectID),
-              projectID: projectID
-            )
-          case .ductSizing:
-            try await DuctSizingView(
-              projectID: projectID,
-              rooms: manualD.calculate(
-                rooms: database.rooms.fetch(projectID),
-                designFrictionRateResult: database.designFrictionRate(projectID: projectID),
-                projectSHR: database.projects.getSensibleHeatRatio(projectID),
-                logger: logger
-              )
-            )
-          // div { "FIX ME!" }
 
+            await resultView(projectID) {
+
+              let equipmentInfo = try await database.equipment.fetch(projectID)
+              let componentLosses = try await database.componentLoss.fetch(projectID)
+              let equivalentLengths = try await database.effectiveLength.fetchMax(projectID)
+              let frictionRateResponse = try await manualD.frictionRate(
+                equipmentInfo: equipmentInfo,
+                componentLosses: componentLosses,
+                effectiveLength: equivalentLengths
+              )
+              return (
+                equipmentInfo, componentLosses, equivalentLengths, frictionRateResponse
+              )
+            } onSuccess: {
+              FrictionRateView(
+                equipmentInfo: $0.0,
+                componentLosses: $0.1,
+                equivalentLengths: $0.2,
+                frictionRateResponse: $0.3
+              )
+            }
+          case .ductSizing:
+            await resultView(projectID) {
+              try await database.calculateDuctSizes(projectID: projectID)
+            } onSuccess: {
+              DuctSizingView(rooms: $0)
+            }
           }
         }
 
@@ -89,8 +108,77 @@ struct ProjectView: HTML, Sendable {
       }
     }
   }
+
+  func resultView<V: Sendable, E: Error, ValueView: HTML>(
+    _ projectID: Project.ID,
+    catching: @escaping @Sendable () async throws(E) -> V,
+    onSuccess: @escaping @Sendable (V) -> ValueView
+  ) async -> ResultView<V, E, _ModifiedTaskLocal<Project.ID, ValueView>, ErrorView<E>>
+  where
+    ValueView: Sendable, E: Sendable
+  {
+    await .init(
+      result: .init(catching: catching),
+      onSuccess: { result in
+        onSuccess(result)
+          .environment(ProjectViewValue.$projectID, projectID)
+      }
+    )
+  }
 }
 
+// extension SiteRoute.View.ProjectRoute.DetailRoute.Tab {
+//
+//   func view(projectID: Project.ID) async throws -> AnySendableHTML {
+//     @Dependency(\.database) var database
+//     @Dependency(\.manualD) var manualD
+//
+//     switch self {
+//     case .project:
+//       if let project = try await database.projects.get(projectID) {
+//         return ProjectDetail(project: project)
+//       } else {
+//         return div {
+//           "FIX ME!"
+//         }
+//       }
+//     case .rooms:
+//       return try await RoomsView(
+//         projectID: projectID,
+//         rooms: database.rooms.fetch(projectID),
+//         sensibleHeatRatio: database.projects.getSensibleHeatRatio(projectID)
+//       )
+//
+//     case .equivalentLength:
+//       return try await EffectiveLengthsView(
+//         projectID: projectID,
+//         effectiveLengths: database.effectiveLength.fetch(projectID)
+//       )
+//     case .frictionRate:
+//       let equipmentInfo = try await database.equipment.fetch(projectID)
+//       let componentLosses = try await database.componentLoss.fetch(projectID)
+//       let equivalentLengths = try await database.effectiveLength.fetchMax(projectID)
+//
+//       return try await FrictionRateView(
+//         equipmentInfo: equipmentInfo,
+//         componentLosses: componentLosses,
+//         equivalentLengths: equivalentLengths,
+//         projectID: projectID,
+//         frictionRateResponse: manualD.frictionRate(
+//           equipmentInfo: equipmentInfo,
+//           componentLosses: componentLosses,
+//           effectiveLength: equivalentLengths
+//         )
+//       )
+//     case .ductSizing:
+//       return try await DuctSizingView(
+//         projectID: projectID,
+//         rooms: database.calculateDuctSizes(projectID: projectID)
+//       )
+//     }
+//   }
+// }
+
 extension ProjectView {
 
   struct Sidebar: HTML {
@@ -261,3 +349,27 @@ extension ProjectView {
     }
   }
 }
+
+extension ManualDClient {
+
+  func frictionRate(
+    equipmentInfo: EquipmentInfo?,
+    componentLosses: [ComponentPressureLoss],
+    effectiveLength: EffectiveLength.MaxContainer
+  ) async throws -> FrictionRateResponse? {
+    guard let staticPressure = equipmentInfo?.staticPressure else {
+      return nil
+    }
+    guard let totalEquivalentLength = effectiveLength.total else {
+      return nil
+    }
+    return try await self.frictionRate(
+      .init(
+        externalStaticPressure: staticPressure,
+        componentPressureLosses: componentLosses,
+        totalEffectiveLength: Int(totalEquivalentLength)
+      )
+    )
+  }
+
+}

Sources/ViewController/Views/Rooms/RoomsView.swift

@@ -5,40 +5,36 @@ import Foundation
 import ManualDCore
 import Styleguide
 
-// TODO: Calculate rooms sensible based on project wide SHR.
-
 struct RoomsView: HTML, Sendable {
-  let projectID: Project.ID
+  @Environment(ProjectViewValue.$projectID) var projectID
+  // let projectID: Project.ID
   let rooms: [Room]
   let sensibleHeatRatio: Double?
 
   var body: some HTML {
     div {
-      Row {
+      h1(.class("text-2xl font-bold pb-6")) { "Room Loads" }
-        h1(.class("text-2xl font-bold")) { "Room Loads" }
-        div(
-          .class("tooltip tooltip-left"),
-          .data("tip", value: "Add room")
-        ) {
-          div(.class("flex me-4")) {
-            PlusButton()
-              .attributes(.showModal(id: RoomForm.id()))
-          }
-        }
-      }
-      .attributes(.class("pb-6"))
 
       div(.class("border rounded-lg mb-6")) {
         Row {
-          div(.class("space-x-6 my-2")) {
+          div {
-            Label("Sensible Heat Ratio")
+            div(.class("space-x-6 my-2 items-center")) {
-            if let sensibleHeatRatio {
+              Label("Sensible Heat Ratio")
-              Number(sensibleHeatRatio)
+                .attributes(.class("my-auto"))
+              if let sensibleHeatRatio {
+                Number(sensibleHeatRatio)
+                  .attributes(.class("badge badge-outline"))
+              }
+            }
+            p(.class("text-sm italic")) {
+              "Project wide sensible heat ratio"
             }
           }
 
-          EditButton()
+          Tooltip("Edit SHR") {
-            .attributes(.showModal(id: SHRForm.id))
+            EditButton()
+              .attributes(.showModal(id: SHRForm.id))
+          }
         }
         .attributes(.class("m-4"))
 
@@ -54,7 +50,18 @@ struct RoomsView: HTML, Sendable {
               th { Label("Cooling Total") }
               th { Label("Cooling Sensible") }
               th { Label("Register Count") }
-              th {}
+              th {
+                div(.class("flex justify-end")) {
+                  Tooltip("Add Room") {
+                    PlusButton()
+                      .attributes(
+                        .class("mx-auto"),
+                        .showModal(id: RoomForm.id())
+                      )
+                  }
+                  .attributes(.class("tooltip-left"))
+                }
+              }
             }
           }
           tbody {
@@ -123,19 +130,24 @@ struct RoomsView: HTML, Sendable {
         td {
           div(.class("flex justify-end")) {
             div(.class("join")) {
-              TrashButton()
+              Tooltip("Delete room", position: .bottom) {
-                .attributes(
+                TrashButton()
-                  .class("join-item"),
+                  .attributes(
-                  .hx.delete(
+                    .class("join-item btn-ghost"),
-                    route: .project(.detail(room.projectID, .rooms(.delete(id: room.id))))),
+                    .hx.delete(
-                  .hx.target("closest tr"),
+                      route: .project(.detail(room.projectID, .rooms(.delete(id: room.id))))),
-                  .hx.confirm("Are you sure?")
+                    .hx.target("closest tr"),
-                )
+                    .hx.confirm("Are you sure?")
-              EditButton()
+                  )
-                .attributes(
+              }
-                  .class("join-item"),
+
-                  .showModal(id: RoomForm.id(room))
+              Tooltip("Edit room", position: .bottom) {
-                )
+                EditButton()
+                  .attributes(
+                    .class("join-item btn-ghost"),
+                    .showModal(id: RoomForm.id(room))
+                  )
+              }
             }
           }
           RoomForm(

input.css

@@ -0,0 +1,6 @@
+@import "tailwindcss";
+
+@source not "./tailwindcss";
+@source not "./daisyui{,*}.mjs";
+
+@plugin "./daisyui.mjs";