From c61dad4e7eceaab16c435af837cc155ac2898f58 Mon Sep 17 00:00:00 2001
From: Antigravity Agent <antigravity@google.com>
Date: Tue, 28 Apr 2026 14:20:02 +0100
Subject: [PATCH] feat: add panel_orientation field to DisplayType

---
 eink/backend/database.py                      |  8 ++++++
 eink/backend/handlers/items.py                |  1 +
 eink/backend/models.py                        |  1 +
 .../scene-item-settings-dialog.test.ts        |  2 ++
 .../components/layout/layout-editor.test.ts   |  1 +
 .../views/display-types-view.test.ts          |  2 ++
 .../components/views/display-types-view.ts    | 28 +++++++++++++------
 .../src/components/views/layouts-view.test.ts |  1 +
 eink/frontend/src/services/HaApiClient.ts     |  1 +
 9 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/eink/backend/database.py b/eink/backend/database.py
index 3e1b7775..0774c4f1 100644
--- a/eink/backend/database.py
+++ b/eink/backend/database.py
@@ -256,6 +256,14 @@ async def ensure_schema_up_to_date(conn):
             )
         )
 
+    if "panel_orientation" not in columns:
+        await conn.execute(
+            text(
+                "ALTER TABLE display_types ADD COLUMN panel_orientation VARCHAR "
+                "DEFAULT 'landscape'"
+            )
+        )
+
     # Check 'layouts' table for recently added columns
     result = await conn.execute(text("PRAGMA table_info(layouts)"))
     columns = [row[1] for row in result.fetchall()]
diff --git a/eink/backend/handlers/items.py b/eink/backend/handlers/items.py
index 71272bae..527d498d 100644
--- a/eink/backend/handlers/items.py
+++ b/eink/backend/handlers/items.py
@@ -17,6 +17,7 @@ def model_to_dict(self, item):
             include_fields={
                 "id",
                 "name",
+                "panel_orientation",
                 "width_mm",
                 "height_mm",
                 "panel_width_mm",
diff --git a/eink/backend/models.py b/eink/backend/models.py
index 33d52ffb..5d6b83d4 100644
--- a/eink/backend/models.py
+++ b/eink/backend/models.py
@@ -126,6 +126,7 @@ class DisplayType(Base):
 
     id = Column(String, primary_key=True)
     name = Column(String, nullable=False)
+    panel_orientation = Column(String, nullable=False, default="landscape")
     width_mm = Column(Integer, nullable=False)
     height_mm = Column(Integer, nullable=False)
     panel_width_mm = Column(Integer, nullable=False)
diff --git a/eink/frontend/src/components/dialogs/scene-item-settings-dialog.test.ts b/eink/frontend/src/components/dialogs/scene-item-settings-dialog.test.ts
index dba646b5..4efb9f20 100644
--- a/eink/frontend/src/components/dialogs/scene-item-settings-dialog.test.ts
+++ b/eink/frontend/src/components/dialogs/scene-item-settings-dialog.test.ts
@@ -30,6 +30,7 @@ describe('SceneItemSettingsDialog', () => {
   const mockDisplayTypes = [{ 
     id: 'dt1', 
     name: '7.5in', 
+    panel_orientation: 'landscape',
     width_px: 800, height_px: 480,
     width_mm: 160, height_mm: 100,
     colour_type: 'BW'
@@ -108,6 +109,7 @@ describe('SceneItemSettingsDialog', () => {
     const customDisplayTypes = [{ 
       id: 'dt1', 
       name: 'Custom', 
+      panel_orientation: 'landscape',
       width_px: 1000, height_px: 500,
       width_mm: 100, height_mm: 50,
       panel_width_mm: 100, panel_height_mm: 50,
diff --git a/eink/frontend/src/components/layout/layout-editor.test.ts b/eink/frontend/src/components/layout/layout-editor.test.ts
index 72415523..eda51fde 100644
--- a/eink/frontend/src/components/layout/layout-editor.test.ts
+++ b/eink/frontend/src/components/layout/layout-editor.test.ts
@@ -30,6 +30,7 @@ describe('LayoutEditor', () => {
   const mockDisplayTypes = [
     { 
         id: 'dt1', 
+        panel_orientation: 'landscape',
         width_mm: 100, 
         height_mm: 100,
         panel_width_mm: 90,
diff --git a/eink/frontend/src/components/views/display-types-view.test.ts b/eink/frontend/src/components/views/display-types-view.test.ts
index af042f5a..6e3d6b0d 100644
--- a/eink/frontend/src/components/views/display-types-view.test.ts
+++ b/eink/frontend/src/components/views/display-types-view.test.ts
@@ -9,6 +9,7 @@ describe('DisplayTypesView', () => {
     {
       id: 'dt1',
       name: 'Display 1',
+      panel_orientation: 'landscape',
       width_mm: 200,
       height_mm: 150,
       panel_width_mm: 180,
@@ -22,6 +23,7 @@ describe('DisplayTypesView', () => {
     {
       id: 'dt2',
       name: 'Display 2',
+      panel_orientation: 'landscape',
       width_mm: 100,
       height_mm: 100,
       panel_width_mm: 80,
diff --git a/eink/frontend/src/components/views/display-types-view.ts b/eink/frontend/src/components/views/display-types-view.ts
index e2dfa586..7a4ca8aa 100644
--- a/eink/frontend/src/components/views/display-types-view.ts
+++ b/eink/frontend/src/components/views/display-types-view.ts
@@ -224,6 +224,7 @@ export class DisplayTypesView extends BaseResourceView {
     return {
       id: '',
       name: '',
+      panel_orientation: 'landscape',
       width_mm: 0,
       height_mm: 0,
       panel_width_mm: 0,
@@ -455,15 +456,24 @@ export class DisplayTypesView extends BaseResourceView {
           ` : html`
             ${this.viewMode === 'graphical' ? html`
               <form id="display-type-form" @submit="${this._handleSubmit}" @input="${() => { this.requestUpdate(); this._updateDirtyState(); }}">
-                <div class="form-group">
-                  <label>Identifier/Name</label>
-                  <input 
-                    type="text" 
-                    required 
-                    .value="${live(this.displayType?.name || '')}"
-                    @input="${(e: any) => this.displayType!.name = e.target.value}"
-                    placeholder="e.g. Living Room Display"
-                  >
+                <div class="row">
+                  <div class="form-group">
+                    <label>Identifier/Name</label>
+                    <input 
+                      type="text" 
+                      required 
+                      .value="${live(this.displayType?.name || '')}"
+                      @input="${(e: any) => this.displayType!.name = e.target.value}"
+                      placeholder="e.g. Living Room Display"
+                    >
+                  </div>
+                  <div class="form-group">
+                    <label>Panel Orientation</label>
+                    <select .value="${live(this.displayType?.panel_orientation || 'landscape')}" @change="${(e: any) => { this.displayType!.panel_orientation = e.target.value; this.requestUpdate(); this._updateDirtyState(); }}">
+                      <option value="landscape">Landscape</option>
+                      <option value="portrait">Portrait</option>
+                    </select>
+                  </div>
                 </div>
 
                 <div class="section-header">Device Dimensions</div>
diff --git a/eink/frontend/src/components/views/layouts-view.test.ts b/eink/frontend/src/components/views/layouts-view.test.ts
index 0a9ccbdb..874170ec 100644
--- a/eink/frontend/src/components/views/layouts-view.test.ts
+++ b/eink/frontend/src/components/views/layouts-view.test.ts
@@ -22,6 +22,7 @@ describe('LayoutsView', () => {
     {
       id: 'dt1',
       name: 'Display Type 1',
+      panel_orientation: 'landscape',
       width_mm: 100,
       height_mm: 60,
       panel_width_mm: 90,
diff --git a/eink/frontend/src/services/HaApiClient.ts b/eink/frontend/src/services/HaApiClient.ts
index a67e1093..95db733d 100644
--- a/eink/frontend/src/services/HaApiClient.ts
+++ b/eink/frontend/src/services/HaApiClient.ts
@@ -6,6 +6,7 @@
 export interface DisplayType {
   id: string;
   name: string;
+  panel_orientation: 'landscape' | 'portrait';
   width_mm: number;
   height_mm: number;
   panel_width_mm: number;