From 64ea8b6dd19cfee326f2a4667c71dc4e25261c81 Mon Sep 17 00:00:00 2001
From: Kevin Cantrell <kevin@cropwatch.io>
Date: Sun, 14 Jun 2026 20:15:37 +0900
Subject: [PATCH] security hardening UI: permission model v2, route takeover,
 remove Stripe/Discord

- 5-level permission model (1=Admin..5=Disabled; read <5, manage <=2) via
  src/lib/constants/permissions.ts, mirroring the API; dropdowns/labels (en+ja),
  Disabled fallbacks 4->5, client-side @cropwatch.io filters removed (now
  enforced server-side)
- rules/reports route takeover: template pages own /rules and /reports; old
  pre-template pages removed; 301 redirects from /rules-new & /reports-new;
  sidebar de-duplicated
- refresh-on-expiry scheduler wired into dashboard, device detail, and location
  page (live Status column)
- Stripe removed: /account/billing route, payments methods/constants in
  api.service.ts, Header billing entry, billing i18n keys
- Discord removed: notifier/send-method option helpers, report
  communication-method fallback, i18n keys
- bump @cropwatchdevelopment/cwui to 0.1.107 (published latest; matches lockfile)

Verified: pnpm install --frozen-lockfile clean, svelte-check 0 errors,
vitest 67/67, production build (adapter-vercel) clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 messages/en.json                              |  81 +-
 messages/ja.json                              |  81 +-
 package.json                                  |   2 +-
 pnpm-lock.yaml                                |  10 +-
 src/lib/api/api.service.ts                    | 167 +---
 src/lib/appContext.svelte.ts                  |   4 +-
 .../dashboard/DashboardCards.svelte           | 102 ++-
 .../displays/RelayDisplay/RelayDisplay.svelte |   9 +-
 src/lib/constants/permissions.ts              |  37 +
 src/lib/i18n/options.ts                       |  39 +-
 src/routes/+layout.server.ts                  |   6 +-
 src/routes/+layout.svelte                     |   4 +-
 src/routes/Header.svelte                      |   3 -
 src/routes/OverviewDrawer.svelte              |  21 +-
 src/routes/Sidebar.svelte                     |  14 -
 src/routes/account/billing/+page.server.ts    | 542 ------------
 src/routes/account/billing/+page.svelte       | 815 ------------------
 .../locations/[location_id]/+page.server.ts   |   3 +-
 .../locations/[location_id]/+page.svelte      |  69 +-
 .../devices/[dev_eui]/+layout.server.ts       |   7 +-
 .../devices/[dev_eui]/+page.svelte            |  58 +-
 .../[dev_eui]/DeviceDashboardHeader.svelte    |   5 +-
 .../DeviceOwnerPermissionsCard.svelte         | 154 ++--
 .../settings/device-settings.server.ts        |   9 +-
 .../[location_id]/settings/+page.server.ts    |   3 +-
 .../settings/LocationEditPermissions.svelte   |  17 +-
 .../location-settings-actions.server.ts       |   8 +-
 src/routes/reports-new/+page.svelte           | 237 -----
 .../reports-new/[...path]/+page.server.ts     |   8 +
 src/routes/reports/+page.server.ts            |   9 -
 src/routes/reports/+page.svelte               | 281 +++---
 src/routes/reports/DeleteReportDialog.svelte  | 133 ---
 .../DeleteReportTemplateDialog.svelte         |   0
 .../ReportCadenceSection.svelte               |   0
 src/routes/reports/ReportHistoryDialog.svelte | 165 ----
 .../ReportProcessingSchedulesSection.svelte   |   0
 .../ReportRecipientsSection.svelte            |   0
 .../ReportTemplateForm.svelte                 |   7 +-
 .../ViewReportHistoryDialog.svelte            |   0
 .../reports/[report_id]/edit/+page.server.ts  | 144 ----
 .../reports/[report_id]/edit/+page.svelte     | 400 ---------
 .../edit/ReportCadenceSection.svelte          |  84 --
 .../ReportProcessingSchedulesSection.svelte   | 201 -----
 .../edit/ReportRecipientsSection.svelte       | 137 ---
 .../edit/alert-points-editor-text.ts          |  67 --
 .../[report_id]/edit/data-pull-interval.ts    |  69 --
 .../[report_id]/edit/report-action.server.ts  | 421 ---------
 .../reports/[report_id]/edit/report-form.ts   | 542 ------------
 .../[report_id]/edit/report-form.types.ts     |  55 --
 .../alert-points-editor-text.ts               |   0
 .../create/+page.server.ts                    |   0
 .../create/+page.svelte                       |   2 +-
 .../data-pull-interval.ts                     |   0
 .../edit/[id]/+page.server.ts                 |   0
 .../edit/[id]/+page.svelte                    |   2 +-
 src/routes/reports/report-row.ts              |  22 -
 .../report-template-form.ts                   |   0
 src/routes/rules-new/+page.svelte             | 254 ------
 .../rules-new/[...path]/+page.server.ts       |   8 +
 src/routes/rules-new/create/+page.server.ts   |  24 -
 src/routes/rules-new/create/+page.svelte      |  40 -
 .../rules-new/edit/[id]/+page.server.ts       |  37 -
 src/routes/rules-new/edit/[id]/+page.svelte   |  49 --
 src/routes/rules/+page.server.ts              |   9 -
 src/routes/rules/+page.svelte                 | 321 ++++---
 src/routes/rules/DeleteRuleDialog.svelte      |  64 --
 .../DeleteRuleTemplateDialog.svelte           |   0
 src/routes/rules/RuleForm.svelte              | 442 ----------
 .../RuleTemplateForm.svelte                   |   4 +-
 .../RuleTemplateTest.svelte                   |   0
 .../ViewRuleAlertHistory.svelte               |   0
 src/routes/rules/ViewRuleDialog.svelte        | 188 ----
 src/routes/rules/create/+page.server.ts       |  15 +-
 src/routes/rules/create/+page.svelte          |  45 +-
 src/routes/rules/edit/[id]/+page.server.ts    |  47 +-
 src/routes/rules/edit/[id]/+page.svelte       |  49 +-
 .../rule-template-alert-points.spec.ts        |   0
 .../rule-template-alert-points.ts             |   0
 78 files changed, 882 insertions(+), 5970 deletions(-)
 create mode 100644 src/lib/constants/permissions.ts
 delete mode 100644 src/routes/account/billing/+page.server.ts
 delete mode 100644 src/routes/account/billing/+page.svelte
 delete mode 100644 src/routes/reports-new/+page.svelte
 create mode 100644 src/routes/reports-new/[...path]/+page.server.ts
 delete mode 100644 src/routes/reports/+page.server.ts
 delete mode 100644 src/routes/reports/DeleteReportDialog.svelte
 rename src/routes/{reports-new => reports}/DeleteReportTemplateDialog.svelte (100%)
 rename src/routes/{reports-new => reports}/ReportCadenceSection.svelte (100%)
 delete mode 100644 src/routes/reports/ReportHistoryDialog.svelte
 rename src/routes/{reports-new => reports}/ReportProcessingSchedulesSection.svelte (100%)
 rename src/routes/{reports-new => reports}/ReportRecipientsSection.svelte (100%)
 rename src/routes/{reports-new => reports}/ReportTemplateForm.svelte (98%)
 rename src/routes/{reports-new => reports}/ViewReportHistoryDialog.svelte (100%)
 delete mode 100644 src/routes/reports/[report_id]/edit/+page.server.ts
 delete mode 100644 src/routes/reports/[report_id]/edit/+page.svelte
 delete mode 100644 src/routes/reports/[report_id]/edit/ReportCadenceSection.svelte
 delete mode 100644 src/routes/reports/[report_id]/edit/ReportProcessingSchedulesSection.svelte
 delete mode 100644 src/routes/reports/[report_id]/edit/ReportRecipientsSection.svelte
 delete mode 100644 src/routes/reports/[report_id]/edit/alert-points-editor-text.ts
 delete mode 100644 src/routes/reports/[report_id]/edit/data-pull-interval.ts
 delete mode 100644 src/routes/reports/[report_id]/edit/report-action.server.ts
 delete mode 100644 src/routes/reports/[report_id]/edit/report-form.ts
 delete mode 100644 src/routes/reports/[report_id]/edit/report-form.types.ts
 rename src/routes/{reports-new => reports}/alert-points-editor-text.ts (100%)
 rename src/routes/{reports-new => reports}/create/+page.server.ts (100%)
 rename src/routes/{reports-new => reports}/create/+page.svelte (97%)
 rename src/routes/{reports-new => reports}/data-pull-interval.ts (100%)
 rename src/routes/{reports-new => reports}/edit/[id]/+page.server.ts (100%)
 rename src/routes/{reports-new => reports}/edit/[id]/+page.svelte (98%)
 delete mode 100644 src/routes/reports/report-row.ts
 rename src/routes/{reports-new => reports}/report-template-form.ts (100%)
 delete mode 100644 src/routes/rules-new/+page.svelte
 create mode 100644 src/routes/rules-new/[...path]/+page.server.ts
 delete mode 100644 src/routes/rules-new/create/+page.server.ts
 delete mode 100644 src/routes/rules-new/create/+page.svelte
 delete mode 100644 src/routes/rules-new/edit/[id]/+page.server.ts
 delete mode 100644 src/routes/rules-new/edit/[id]/+page.svelte
 delete mode 100644 src/routes/rules/+page.server.ts
 delete mode 100644 src/routes/rules/DeleteRuleDialog.svelte
 rename src/routes/{rules-new => rules}/DeleteRuleTemplateDialog.svelte (100%)
 delete mode 100644 src/routes/rules/RuleForm.svelte
 rename src/routes/{rules-new => rules}/RuleTemplateForm.svelte (99%)
 rename src/routes/{rules-new => rules}/RuleTemplateTest.svelte (100%)
 rename src/routes/{rules-new => rules}/ViewRuleAlertHistory.svelte (100%)
 delete mode 100644 src/routes/rules/ViewRuleDialog.svelte
 rename src/routes/{rules-new => rules}/rule-template-alert-points.spec.ts (100%)
 rename src/routes/{rules-new => rules}/rule-template-alert-points.ts (100%)

diff --git a/messages/en.json b/messages/en.json
index f4b4188b..df2a380c 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -41,7 +41,6 @@
 	"nav_rules": "Rules",
 	"nav_reports": "Reports",
 	"nav_profile": "Profile",
-	"nav_billing": "Billing",
 	"nav_settings": "Settings",
 	"nav_logout": "Logout",
 	"header_privacy_mode": "Privacy Mode",
@@ -278,6 +277,7 @@
 	"devices_device": "Device",
 	"devices_add_device": "Add Device",
 	"devices_device_name": "Device Name",
+	"devices_status": "Status",
 	"devices_unnamed_device": "Unnamed Device",
 	"rules_page_title": "Rules - CropWatch",
 	"rules_configured_rules": "Configured Rules",
@@ -557,7 +557,6 @@
 	"reports_create_operator_range": "is between",
 	"reports_create_method_email": "Email",
 	"reports_create_method_sms": "Text message",
-	"reports_create_method_discord": "Discord",
 	"reports_schedule_card_title": "Data Processing Schedules",
 	"reports_schedule_card_subtitle": "Configure what data to include or exclude based on time ranges.",
 	"reports_schedule_card_copy": "Add one or more time windows to control which readings are included in this report.",
@@ -599,13 +598,6 @@
 	"rule_operator_greater_or_equal": "Greater or equal (>=)",
 	"rule_operator_less_or_equal": "Less or equal (<=)",
 	"rule_operator_not_equal": "Not equal (!=)",
-	"rule_notifier_email": "Email",
-	"rule_notifier_sms": "SMS",
-	"rule_notifier_push": "Push Notification",
-	"rule_notifier_discord": "Discord",
-	"rule_send_email": "Email",
-	"rule_send_sms": "SMS",
-	"rule_send_both": "Both",
 	"rule_subject_temperature": "Temperature (°C)",
 	"rule_subject_humidity": "Humidity (%)",
 	"rule_subject_co2": "CO₂ (ppm)",
@@ -627,77 +619,6 @@
 	"validation_user_email_required": "User email is required.",
 	"validation_valid_email_required": "Enter a valid email address.",
 	"validation_correct_highlighted_fields": "Please correct the highlighted fields.",
-	"billing_account_status": "Account: {status}",
-	"billing_active_seats": "Active Seats",
-	"billing_active_seats_subtitle": "Currently billed subscriptions",
-	"billing_allow_discount_codes": "Allow discount codes",
-	"billing_allow_trial": "Allow trial",
-	"billing_api_warnings": "API Warnings",
-	"billing_api_warnings_subtitle": "Some endpoints returned errors",
-	"billing_archived": "Archived",
-	"billing_available_products": "Available Products",
-	"billing_available_products_subtitle": "Returned by payments API",
-	"billing_billed_interval": "Billed {interval}",
-	"billing_cancel_subscription_body": "Cancel {productName} ({id})?",
-	"billing_cancel_subscription_title": "Cancel Subscription",
-	"billing_cancel_subscription_warning": "This action calls the revoke endpoint and cannot be undone from this page.",
-	"billing_canceled": "Canceled",
-	"billing_canceled_subtitle": "Historical cancellations",
-	"billing_checkout_redirect_missing": "Checkout session was created, but no redirect URL was returned.",
-	"billing_checkout_session_created": "Checkout session created.",
-	"billing_checkout_session_failed": "Unable to create checkout session.",
-	"billing_checkout_subtitle": "Choose one or more products, then launch hosted checkout",
-	"billing_checkout_title": "Buy Seats & Devices",
-	"billing_clear_selection": "Clear Selection",
-	"billing_column_plan": "Plan",
-	"billing_column_price": "Price",
-	"billing_column_renews": "Renews",
-	"billing_column_started": "Started",
-	"billing_column_status": "Status",
-	"billing_confirm_cancel": "Confirm Cancel",
-	"billing_custom_pricing": "Custom pricing",
-	"billing_customer_email": "Customer email",
-	"billing_customer_email_placeholder": "jane@example.com",
-	"billing_customer_name": "Customer name",
-	"billing_customer_name_placeholder": "Jane Smith",
-	"billing_ended": "Ended",
-	"billing_error_products": "Products: {message}",
-	"billing_error_state": "State: {message}",
-	"billing_error_subscriptions": "Subscriptions: {message}",
-	"billing_heading": "Billing & Subscriptions",
-	"billing_include_archived_products": "Include archived products",
-	"billing_include_in_checkout": "Include in checkout",
-	"billing_keep_subscription": "Keep Subscription",
-	"billing_launch_checkout": "Launch Checkout",
-	"billing_load_products_failed": "Unable to load billing products.",
-	"billing_load_state_failed": "Unable to load subscription state.",
-	"billing_load_subscriptions_failed": "Unable to load subscriptions.",
-	"billing_no_product_description": "No description provided by API.",
-	"billing_no_products": "No products found for checkout.",
-	"billing_one_time": "One-time",
-	"billing_open_portal": "Open Billing Portal",
-	"billing_optional_checkout_settings": "Optional Checkout Settings",
-	"billing_portal_open_failed": "Unable to open billing portal.",
-	"billing_portal_opened": "Billing portal opened.",
-	"billing_portal_redirect_missing": "Portal session was created, but no redirect URL was returned.",
-	"billing_portal_session_created": "Billing portal session created.",
-	"billing_select_product_before_checkout": "Select at least one product before checkout.",
-	"billing_selected_count": "{count} selected",
-	"billing_status_active": "Active",
-	"billing_status_canceled": "Canceled",
-	"billing_status_past_due": "Past due",
-	"billing_status_trial": "Trial",
-	"billing_status_unknown": "Unknown",
-	"billing_status_unpaid": "Unpaid",
-	"billing_subscription_cancel_failed": "Unable to cancel subscription.",
-	"billing_subscription_canceled": "Subscription canceled successfully.",
-	"billing_subscription_id_required": "Subscription id is required.",
-	"billing_subscriptions_subtitle": "Current and historical subscription records",
-	"billing_subscriptions_title": "Subscriptions",
-	"billing_subtitle": "Manage plan purchases, active subscriptions, and customer portal access.",
-	"billing_trial_plans": "Trial Plans",
-	"billing_trial_plans_subtitle": "In trial period",
-	"billing_unknown_plan": "Unknown plan",
 	"common_location": "Location",
 	"common_weather": "Weather",
 	"dashboard_active_alert_alt": "Active alert",
diff --git a/messages/ja.json b/messages/ja.json
index d2b15787..30f4e322 100644
--- a/messages/ja.json
+++ b/messages/ja.json
@@ -41,7 +41,6 @@
 	"nav_rules": "ルール",
 	"nav_reports": "レポート",
 	"nav_profile": "プロフィール",
-	"nav_billing": "請求",
 	"nav_settings": "設定",
 	"nav_logout": "ログアウト",
 	"header_privacy_mode": "プライバシーモード",
@@ -278,6 +277,7 @@
 	"devices_device": "デバイス",
 	"devices_add_device": "デバイスを追加",
 	"devices_device_name": "デバイス名",
+	"devices_status": "ステータス",
 	"devices_unnamed_device": "名称未設定のデバイス",
 	"rules_page_title": "ルール - CropWatch",
 	"rules_configured_rules": "設定済みルール",
@@ -557,7 +557,6 @@
 	"reports_create_operator_range": "の間",
 	"reports_create_method_email": "メール",
 	"reports_create_method_sms": "テキストメッセージ",
-	"reports_create_method_discord": "Discord",
 	"reports_schedule_card_title": "データ処理スケジュール",
 	"reports_schedule_card_subtitle": "時間範囲に基づいてレポートに含めるデータを設定します。",
 	"reports_schedule_card_copy": "このレポートに含む計測値を制御するため、1つ以上の時間ウィンドウを追加してください。",
@@ -599,13 +598,6 @@
 	"rule_operator_greater_or_equal": "以上 (>=)",
 	"rule_operator_less_or_equal": "以下 (<=)",
 	"rule_operator_not_equal": "等しくない (!=)",
-	"rule_notifier_email": "メール",
-	"rule_notifier_sms": "SMS",
-	"rule_notifier_push": "プッシュ通知",
-	"rule_notifier_discord": "Discord",
-	"rule_send_email": "メール",
-	"rule_send_sms": "SMS",
-	"rule_send_both": "両方",
 	"rule_subject_temperature": "温度 (°C)",
 	"rule_subject_humidity": "湿度 (%)",
 	"rule_subject_co2": "CO₂ (ppm)",
@@ -627,77 +619,6 @@
 	"validation_user_email_required": "ユーザーメールアドレスは必須です。",
 	"validation_valid_email_required": "有効なメールアドレスを入力してください。",
 	"validation_correct_highlighted_fields": "ハイライトされた項目を修正してください。",
-	"billing_account_status": "アカウント: {status}",
-	"billing_active_seats": "有効な契約数",
-	"billing_active_seats_subtitle": "現在課金中のサブスクリプション",
-	"billing_allow_discount_codes": "割引コードを許可",
-	"billing_allow_trial": "トライアルを許可",
-	"billing_api_warnings": "API 警告",
-	"billing_api_warnings_subtitle": "一部のエンドポイントでエラーが返されました",
-	"billing_archived": "アーカイブ済み",
-	"billing_available_products": "利用可能な商品",
-	"billing_available_products_subtitle": "決済 API から返された商品",
-	"billing_billed_interval": "{interval} ごとに請求",
-	"billing_cancel_subscription_body": "{productName} ({id}) を解約しますか？",
-	"billing_cancel_subscription_title": "サブスクリプションを解約",
-	"billing_cancel_subscription_warning": "この操作は revoke エンドポイントを呼び出し、このページからは元に戻せません。",
-	"billing_canceled": "解約済み",
-	"billing_canceled_subtitle": "過去の解約履歴",
-	"billing_checkout_redirect_missing": "チェックアウトセッションは作成されましたが、リダイレクト URL が返されませんでした。",
-	"billing_checkout_session_created": "チェックアウトセッションを作成しました。",
-	"billing_checkout_session_failed": "チェックアウトセッションを作成できませんでした。",
-	"billing_checkout_subtitle": "1 つ以上の商品を選択して、ホスト型チェックアウトを起動します",
-	"billing_checkout_title": "契約とデバイスを購入",
-	"billing_clear_selection": "選択をクリア",
-	"billing_column_plan": "プラン",
-	"billing_column_price": "価格",
-	"billing_column_renews": "更新日",
-	"billing_column_started": "開始日",
-	"billing_column_status": "状態",
-	"billing_confirm_cancel": "解約を確定",
-	"billing_custom_pricing": "個別見積もり",
-	"billing_customer_email": "顧客メールアドレス",
-	"billing_customer_email_placeholder": "jane@example.com",
-	"billing_customer_name": "顧客名",
-	"billing_customer_name_placeholder": "Jane Smith",
-	"billing_ended": "終了",
-	"billing_error_products": "商品: {message}",
-	"billing_error_state": "状態: {message}",
-	"billing_error_subscriptions": "サブスクリプション: {message}",
-	"billing_heading": "請求とサブスクリプション",
-	"billing_include_archived_products": "アーカイブ済み商品を含める",
-	"billing_include_in_checkout": "チェックアウトに含める",
-	"billing_keep_subscription": "継続する",
-	"billing_launch_checkout": "チェックアウトを開始",
-	"billing_load_products_failed": "請求商品の読み込みに失敗しました。",
-	"billing_load_state_failed": "サブスクリプション状態の読み込みに失敗しました。",
-	"billing_load_subscriptions_failed": "サブスクリプションの読み込みに失敗しました。",
-	"billing_no_product_description": "API から説明が返されませんでした。",
-	"billing_no_products": "チェックアウトできる商品が見つかりません。",
-	"billing_one_time": "単発購入",
-	"billing_open_portal": "請求ポータルを開く",
-	"billing_optional_checkout_settings": "任意のチェックアウト設定",
-	"billing_portal_open_failed": "請求ポータルを開けませんでした。",
-	"billing_portal_opened": "請求ポータルを開きました。",
-	"billing_portal_redirect_missing": "ポータルセッションは作成されましたが、リダイレクト URL が返されませんでした。",
-	"billing_portal_session_created": "請求ポータルセッションを作成しました。",
-	"billing_select_product_before_checkout": "チェックアウト前に少なくとも 1 つの商品を選択してください。",
-	"billing_selected_count": "{count} 件を選択中",
-	"billing_status_active": "有効",
-	"billing_status_canceled": "解約済み",
-	"billing_status_past_due": "支払い遅延",
-	"billing_status_trial": "トライアル",
-	"billing_status_unknown": "不明",
-	"billing_status_unpaid": "未払い",
-	"billing_subscription_cancel_failed": "サブスクリプションを解約できませんでした。",
-	"billing_subscription_canceled": "サブスクリプションを解約しました。",
-	"billing_subscription_id_required": "サブスクリプション ID は必須です。",
-	"billing_subscriptions_subtitle": "現在および過去のサブスクリプション記録",
-	"billing_subscriptions_title": "サブスクリプション",
-	"billing_subtitle": "プラン購入、アクティブなサブスクリプション、顧客ポータルへのアクセスを管理します。",
-	"billing_trial_plans": "トライアルプラン",
-	"billing_trial_plans_subtitle": "トライアル期間中",
-	"billing_unknown_plan": "不明なプラン",
 	"common_location": "ロケーション",
 	"common_weather": "天気",
 	"dashboard_active_alert_alt": "アクティブなアラート",
diff --git a/package.json b/package.json
index c0dcb25e..103ad293 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
 	},
 	"packageManager": "pnpm@10.18.2+sha512.9fb969fa749b3ade6035e0f109f0b8a60b5d08a1a87fdf72e337da90dcc93336e2280ca4e44f2358a649b83c17959e9993e777c2080879f3801e6f0d999ad3dd",
 	"dependencies": {
-		"@cropwatchdevelopment/cwui": "0.1.105",
+		"@cropwatchdevelopment/cwui": "0.1.107",
 		"@supabase/supabase-js": "^2.98.0"
 	}
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a43647a4..79277ca3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,8 +9,8 @@ importers:
   .:
     dependencies:
       '@cropwatchdevelopment/cwui':
-        specifier: 0.1.105
-        version: 0.1.105(svelte@5.53.0)
+        specifier: 0.1.107
+        version: 0.1.107(svelte@5.53.0)
       '@supabase/supabase-js':
         specifier: ^2.98.0
         version: 2.98.0
@@ -117,8 +117,8 @@ importers:
 
 packages:
 
-  '@cropwatchdevelopment/cwui@0.1.105':
-    resolution: {integrity: sha512-hmN1d7aNy4D+NUYc6G5nSILI4UBFxwngocojzf3wtrPfecoFAgbHbMEuiQe/p/norhdkG5wGR9frckqkAB0wwA==, tarball: https://npm.pkg.github.com/download/@cropwatchdevelopment/cwui/0.1.105/fb228c70c83b370df92b60cf8de16ce687f161f9}
+  '@cropwatchdevelopment/cwui@0.1.107':
+    resolution: {integrity: sha512-09HVLBZxM+Q4NBNfIgLEurWlt4NDnkV/NPwvLP3Bm0xWH+zUIVoC1MpRdn/2EsEAIYoOIz4tHzhVVIbfigsODA==, tarball: https://npm.pkg.github.com/download/@cropwatchdevelopment/cwui/0.1.107/f942b24e41a617c9a85ad5e27c0e9cefa45d7ae9}
     peerDependencies:
       svelte: ^5.0.0
 
@@ -2147,7 +2147,7 @@ packages:
 
 snapshots:
 
-  '@cropwatchdevelopment/cwui@0.1.105(svelte@5.53.0)':
+  '@cropwatchdevelopment/cwui@0.1.107(svelte@5.53.0)':
     dependencies:
       svelte: 5.53.0
 
diff --git a/src/lib/api/api.service.ts b/src/lib/api/api.service.ts
index 6f339a94..a8580d6b 100644
--- a/src/lib/api/api.service.ts
+++ b/src/lib/api/api.service.ts
@@ -1,10 +1,7 @@
 import { env as publicEnv } from '$env/dynamic/public';
-import type { PdfFile } from '../interfaces/PdfFile.interface';
 import type {
 	CreateDeviceRequest,
 	CreateLocationRequest,
-	CreateReportRequest,
-	CreateRuleRequest,
 	DashboardLocationPage,
 	DashboardPage,
 	DashboardQuery,
@@ -22,8 +19,6 @@ import type {
 	LoginResponse,
 	PaginatedResponse,
 	PaginationQuery,
-	ReportDto,
-	ReportsQuery,
 	ReportTemplateDto,
 	ReportTemplateListQuery,
 	ReportTemplateSaveRequest,
@@ -31,13 +26,11 @@ import type {
 	ReportTemplateHistoryItemDto,
 	CommunicationMethodDto,
 	RuleActionTypeDto,
-	RuleDto,
 	RuleFormContextDto,
 	RuleTemplateDto,
 	RuleTemplateListQuery,
 	RuleTemplateSaveRequest,
 	RuleTriggerLogDto,
-	RulesQuery,
 	SensorTimeSeriesPoint,
 	TimeRangeQuery,
 	TrafficDataPoint,
@@ -48,8 +41,6 @@ import type {
 	UpdateRelayRequest,
 	UpdateLocationRequest,
 	UpdateLocationOwnerRequest,
-	UpdateReportRequest,
-	UpdateRuleRequest,
 	WaterDataPoint,
 	GatewayDto
 } from './api.dtos';
@@ -143,25 +134,11 @@ const LOCATION_PERMISSION_UPDATE_PERMISSION_LEVEL_ENDPOINT = '/locations/{id}/pe
 const POWER_ENDPOINT = '/power/{id}';
 const RELAY_ENDPOINT = '/relay/{dev_eui}';
 const RELAY_PULSE_ENDPOINT = '/relay/{dev_eui}/pulse';
-const PAYMENTS_PRODUCTS_ENDPOINT = '/payments/products';
-const PAYMENTS_SUBSCRIPTIONS_ENDPOINT = '/payments/subscriptions';
-const PAYMENTS_SUBSCRIPTION_STATE_ENDPOINT = '/payments/subscriptions/state';
-const PAYMENTS_SUBSCRIPTIONS_CHECKOUT_ENDPOINT = '/payments/subscriptions/checkout';
-const PAYMENTS_SUBSCRIPTIONS_PORTAL_ENDPOINT = '/payments/subscriptions/portal';
-const REPORTS_ENDPOINT = '/reports';
-const REPORTS_BASE_ENDPOINT = publicEnv.PUBLIC_REPORTS_ENDPOINT ?? REPORTS_ENDPOINT;
-const REPORT_BY_REPORT_ID_ENDPOINT = `${REPORTS_BASE_ENDPOINT}/{report_id}`;
-const RULES_BASE_ENDPOINT = publicEnv.PUBLIC_RULES_ENDPOINT ?? '/rules';
 const RULE_TEMPLATES_ENDPOINT = publicEnv.PUBLIC_RULE_TEMPLATES_ENDPOINT ?? '/rules-new';
 const RULE_TEMPLATE_ACTION_TYPES_ENDPOINT = `${RULE_TEMPLATES_ENDPOINT}/action-types`;
 const RULE_TEMPLATE_FORM_CONTEXT_ENDPOINT = `${RULE_TEMPLATES_ENDPOINT}/form-context`;
-const TRIGGERED_RULES_BASE_ENDPOINT =
-	publicEnv.PUBLIC_TRIGGERED_RULES_ENDPOINT ?? `${RULES_BASE_ENDPOINT}/triggered`;
-const TRIGGERED_RULES_COUNT_ENDPOINT =
-	publicEnv.PUBLIC_TRIGGERED_RULES_ENDPOINT_COUNT ?? `${TRIGGERED_RULES_BASE_ENDPOINT}/count`;
-const REPORT_HISTORY_ENDPOINT = `${REPORTS_BASE_ENDPOINT}/history/{dev_eui}`;
-const REPORT_DOWNLOAD_ENDPOINT = `${REPORTS_BASE_ENDPOINT}/download/{dev_eui}/{report_id}/{reportName}`;
-const RULE_BY_ID_ENDPOINT = `${RULES_BASE_ENDPOINT}/{id}`;
+const TRIGGERED_RULES_BASE_ENDPOINT = `${RULE_TEMPLATES_ENDPOINT}/triggered`;
+const TRIGGERED_RULES_COUNT_ENDPOINT = `${TRIGGERED_RULES_BASE_ENDPOINT}/count`;
 const RULE_TEMPLATE_BY_ID_ENDPOINT = `${RULE_TEMPLATES_ENDPOINT}/{id}`;
 const RULE_TEMPLATE_HISTORY_ENDPOINT = `${RULE_TEMPLATES_ENDPOINT}/{id}/history`;
 const REPORT_TEMPLATES_ENDPOINT = publicEnv.PUBLIC_REPORT_TEMPLATES_ENDPOINT ?? '/reports-new';
@@ -1073,24 +1050,8 @@ export class ApiService {
 		);
 	}
 
-	public createRule(payload: CreateRuleRequest): Promise<RuleDto> {
-		return this.request<RuleDto>(RULES_BASE_ENDPOINT, {
-			method: 'POST',
-			body: payload
-		});
-	}
-
-	public getRules(query: RulesQuery = {}): Promise<RuleDto[]> {
-		return this.request<RuleDto[]>(RULES_BASE_ENDPOINT, {
-			method: 'GET',
-			query: {
-				name: query.name
-			}
-		});
-	}
-
-	public getTriggeredRules(): Promise<RuleDto[]> {
-		return this.request<RuleDto[]>(TRIGGERED_RULES_BASE_ENDPOINT, {
+	public getTriggeredRules(): Promise<RuleTemplateDto[]> {
+		return this.request<RuleTemplateDto[]>(TRIGGERED_RULES_BASE_ENDPOINT, {
 			method: 'GET'
 		});
 	}
@@ -1101,25 +1062,6 @@ export class ApiService {
 		});
 	}
 
-	public getRule(id: number): Promise<RuleDto> {
-		return this.request<RuleDto>(replacePathParams(RULE_BY_ID_ENDPOINT, { id }), {
-			method: 'GET'
-		});
-	}
-
-	public updateRule(id: number, payload: UpdateRuleRequest): Promise<RuleDto> {
-		return this.request<RuleDto>(replacePathParams(RULE_BY_ID_ENDPOINT, { id }), {
-			method: 'PATCH',
-			body: payload
-		});
-	}
-
-	public deleteRule(ruleGroupId: string): Promise<number> {
-		return this.request<number>(replacePathParams(RULE_BY_ID_ENDPOINT, { id: ruleGroupId }), {
-			method: 'DELETE'
-		});
-	}
-
 	public getRuleTemplates(
 		query: RuleTemplateListQuery = {},
 		options: ApiMethodOptions = {}
@@ -1313,112 +1255,11 @@ export class ApiService {
 		);
 	}
 
-	public createReport(payload: CreateReportRequest): Promise<ReportDto> {
-		return this.request<ReportDto>(REPORTS_BASE_ENDPOINT, {
-			method: 'POST',
-			body: payload
-		});
-	}
-
-	public getReports(query: ReportsQuery = {}): Promise<ReportDto[]> {
-		return this.request<ReportDto[]>(REPORTS_BASE_ENDPOINT, {
-			method: 'GET',
-			query: {
-				name: query.name
-			}
-		});
-	}
-
-	public getReportHistory(devEui: string): Promise<PdfFile[]> {
-		return this.request<PdfFile[]>(
-			replacePathParams(REPORT_HISTORY_ENDPOINT, { dev_eui: devEui }),
-			{
-				method: 'GET'
-			}
-		);
-	}
-
-	public getReportDownloadUrl(
-		dev_eui: string,
-		report_id: string,
-		reportName: string
-	): Promise<Record<string, unknown>> {
-		return this.request<Record<string, unknown>>(
-			replacePathParams(REPORT_DOWNLOAD_ENDPOINT, { dev_eui, report_id, reportName }),
-			{
-				method: 'GET'
-			}
-		);
-	}
-
-	public getReport(reportId: string): Promise<ReportDto> {
-		return this.request<ReportDto>(
-			replacePathParams(REPORT_BY_REPORT_ID_ENDPOINT, { report_id: reportId }),
-			{
-				method: 'GET'
-			}
-		);
-	}
-
-	public updateReport(reportId: string, payload: UpdateReportRequest): Promise<ReportDto> {
-		return this.request<ReportDto>(
-			replacePathParams(REPORT_BY_REPORT_ID_ENDPOINT, { report_id: reportId }),
-			{
-				method: 'PATCH',
-				body: payload
-			}
-		);
-	}
-
-	public deleteReport(reportId: string): Promise<number> {
-		return this.request<number>(
-			replacePathParams(REPORT_BY_REPORT_ID_ENDPOINT, { report_id: reportId }),
-			{
-				method: 'DELETE'
-			}
-		);
-	}
-
-	public getPaymentsProducts(): Promise<unknown> {
-		return this.request<unknown>(PAYMENTS_PRODUCTS_ENDPOINT, { method: 'GET' });
-	}
-
-	public getPaymentsSubscriptions(): Promise<unknown> {
-		return this.request<unknown>(PAYMENTS_SUBSCRIPTIONS_ENDPOINT, { method: 'GET' });
-	}
-
-	public getPaymentsSubscriptionState(): Promise<unknown> {
-		return this.request<unknown>(PAYMENTS_SUBSCRIPTION_STATE_ENDPOINT, { method: 'GET' });
-	}
-
-	public createPaymentsCheckoutSession(payload: Record<string, unknown>): Promise<unknown> {
-		return this.request<unknown>(PAYMENTS_SUBSCRIPTIONS_CHECKOUT_ENDPOINT, {
-			method: 'POST',
-			body: payload
-		});
-	}
-
-	public createPaymentsPortalSession(payload: Record<string, unknown>): Promise<unknown> {
-		return this.request<unknown>(PAYMENTS_SUBSCRIPTIONS_PORTAL_ENDPOINT, {
-			method: 'POST',
-			body: payload
-		});
-	}
-
 	public getGateways(): Promise<GatewayDto[]> {
 		return this.request<GatewayDto[]>(GATEWAYS_ENDPOINT, {
 			method: 'GET'
 		});
 	}
-
-	public cancelPaymentsSubscription(subscriptionId: string): Promise<unknown> {
-		return this.request<unknown>(
-			`${PAYMENTS_SUBSCRIPTIONS_ENDPOINT}/${encodeURIComponent(subscriptionId)}`,
-			{
-				method: 'DELETE'
-			}
-		);
-	}
 }
 
 export * from './api.dtos';
diff --git a/src/lib/appContext.svelte.ts b/src/lib/appContext.svelte.ts
index 985cf81b..e8ff02f4 100644
--- a/src/lib/appContext.svelte.ts
+++ b/src/lib/appContext.svelte.ts
@@ -5,7 +5,7 @@ import type { IDevice } from './interfaces/device.interface';
 import type { IRule } from './interfaces/rule.interface';
 import type { Profile } from './interfaces/profile.interface';
 import { createCwAlarmScheduler } from '@cropwatchdevelopment/cwui';
-import type { RuleDto, TriggeredRulesCountResponse } from './api/api.service';
+import type { RuleTemplateDto, TriggeredRulesCountResponse } from './api/api.service';
 import type { LocationDto } from './api/api.dtos';
 
 const DEVICE_STALE_MINUTES = 10;
@@ -23,7 +23,7 @@ export interface AppContext {
 	deviceStatuses: { online: number; offline: number };
 	totalDeviceCount?: number;
 	rules: IRule[];
-	triggeredRules: RuleDto[];
+	triggeredRules: RuleTemplateDto[];
 	triggeredRulesCount: number;
 	staleDeviceIds: string[];
 	accessToken?: string;
diff --git a/src/lib/components/dashboard/DashboardCards.svelte b/src/lib/components/dashboard/DashboardCards.svelte
index b08e56c3..fd036277 100644
--- a/src/lib/components/dashboard/DashboardCards.svelte
+++ b/src/lib/components/dashboard/DashboardCards.svelte
@@ -6,11 +6,16 @@
 <script lang="ts">
 	import { onMount, onDestroy, untrack } from 'svelte';
 	import {
+		attachCwDeviceRefreshVisibility,
+		createCwDeviceRefreshScheduler,
+		normalizeCwUploadIntervalMinutes,
 		CwButton,
 		CwDuration,
 		CwLocationCard,
 		CwSensorCard,
-		CwSpinner
+		CwSpinner,
+		type CwDeviceRefreshResult,
+		type CwDeviceRefreshScheduler
 	} from '@cropwatchdevelopment/cwui';
 	import { ApiService } from '$lib/api/api.service';
 	import type { DashboardLocationGroup, DashboardRow } from '$lib/api/api.dtos';
@@ -34,7 +39,6 @@
 	}
 
 	const PAGE_SIZE = 20;
-	const REFRESH_INTERVAL_MS = 10 * 60 * 1000;
 
 	let { filters, cardLayout = 'grid' }: { filters: Filters; cardLayout?: CardLayout } =
 		$props();
@@ -47,7 +51,10 @@
 	// True while a full reload (initial load or filter change) is in flight, as
 	// opposed to a "load more" append. Drives the full-area loading spinner.
 	let reloading = $state(false);
-	let pollTimer: ReturnType<typeof setInterval> | null = null;
+	// Refetches each device when its own upload window (last seen +
+	// upload_interval + grace) expires, with capped backoff while it stays
+	// stale — replaces the old fixed 10-minute full-page poll.
+	let refreshScheduler: CwDeviceRefreshScheduler | null = null;
 
 	// dev_eui -> latest row | 'loading' | undefined (not requested yet).
 	let detailsByDevEui = $state<Record<string, Record<string, unknown> | 'loading'>>({});
@@ -96,6 +103,7 @@
 			groups = opts.reset ? page.groups : [...groups, ...page.groups];
 			total = page.total;
 			preloadOpenCardDetails(page.groups);
+			syncRefreshScheduler();
 		} catch (err) {
 			console.error('Failed to load dashboard page', err);
 		} finally {
@@ -128,11 +136,83 @@
 				}
 			}
 			total = page.total;
+			syncRefreshScheduler();
 		} catch (err) {
 			console.error('Failed to refresh dashboard', err);
 		}
 	}
 
+	function findRowByDevEui(devEui: string): DashboardRow | null {
+		for (const group of groups) {
+			for (const row of group.devices) {
+				if (row.dev_eui === devEui) return row;
+			}
+		}
+		return null;
+	}
+
+	function readLatestColumn(
+		latest: Record<string, unknown>,
+		column: string | null | undefined
+	): number | string | boolean | null {
+		if (!column || column === '-') return null;
+		const value = latest[column];
+		return value === undefined || value === null ? null : (value as number | string | boolean);
+	}
+
+	/** Per-device refetch for the scheduler: the latest full data row. */
+	async function fetchLatestForRefresh(devEui: string): Promise<CwDeviceRefreshResult | null> {
+		if (!app.accessToken) return null;
+		const api = new ApiService({ authToken: app.accessToken });
+		const latest = await api.getDashboardDeviceLatest(devEui);
+		if (!latest) return null;
+		const createdAt = typeof latest.created_at === 'string' ? latest.created_at : null;
+		return { lastSeenAt: createdAt, data: latest };
+	}
+
+	/** Patch a single card in place from a refetched latest-data row. */
+	function applyRefreshedLatest(devEui: string, result: CwDeviceRefreshResult) {
+		const latest = result.data as Record<string, unknown> | undefined;
+		const row = findRowByDevEui(devEui);
+		if (!row || !latest) return;
+
+		const createdAt = typeof latest.created_at === 'string' ? latest.created_at : null;
+		row.latest = {
+			created_at: createdAt ?? row.latest?.created_at ?? null,
+			primary: readLatestColumn(latest, row.device_type.primary_data_v2),
+			secondary: readLatestColumn(latest, row.device_type.secondary_data_v2)
+		};
+		if (createdAt) {
+			row.last_data_updated_at = createdAt;
+		}
+		// Keep the expanded details panel in sync when it is already loaded.
+		if (detailsByDevEui[devEui] !== undefined && detailsByDevEui[devEui] !== 'loading') {
+			detailsByDevEui[devEui] = latest;
+		}
+	}
+
+	/** (Re)register every visible device and drop ones no longer on screen. */
+	function syncRefreshScheduler() {
+		if (!refreshScheduler) return;
+
+		const seen = new Set<string>();
+		for (const group of groups) {
+			for (const row of group.devices) {
+				seen.add(row.dev_eui);
+				refreshScheduler.track({
+					id: row.dev_eui,
+					lastSeenAt: row.last_data_updated_at ?? row.latest?.created_at ?? null,
+					uploadIntervalMinutes:
+						normalizeCwUploadIntervalMinutes(row.upload_interval) ??
+						normalizeCwUploadIntervalMinutes(row.device_type.default_upload_interval)
+				});
+			}
+		}
+		for (const devEui of refreshScheduler.states.keys()) {
+			if (!seen.has(devEui)) refreshScheduler.untrack(devEui);
+		}
+	}
+
 	async function loadDetails(devEui: string) {
 		if (detailsByDevEui[devEui] !== undefined) return;
 		detailsByDevEui[devEui] = 'loading';
@@ -235,19 +315,29 @@
 	};
 
 	let removeForegroundListener: (() => void) | null = null;
+	let detachRefreshVisibility: (() => void) | null = null;
 
 	onMount(() => {
-		pollTimer = setInterval(refreshLoaded, REFRESH_INTERVAL_MS);
+		refreshScheduler = createCwDeviceRefreshScheduler({
+			fetcher: fetchLatestForRefresh,
+			onData: applyRefreshedLatest
+		});
+		detachRefreshVisibility = attachCwDeviceRefreshVisibility(refreshScheduler);
+		syncRefreshScheduler();
+
 		// Pull fresh data whenever the user returns to the tab/app, so devices
 		// that went "stale" while the page sat in the background don't linger as
-		// false offline indicators.
+		// false offline indicators. syncRefreshScheduler() inside refreshLoaded
+		// re-arms each device from its fresh last-seen timestamp.
 		removeForegroundListener = onAppForeground(() => {
 			void refreshLoaded();
 		});
 	});
 
 	onDestroy(() => {
-		if (pollTimer) clearInterval(pollTimer);
+		detachRefreshVisibility?.();
+		refreshScheduler?.destroy();
+		refreshScheduler = null;
 		removeForegroundListener?.();
 	});
 </script>
diff --git a/src/lib/components/displays/RelayDisplay/RelayDisplay.svelte b/src/lib/components/displays/RelayDisplay/RelayDisplay.svelte
index b6d4c90f..fe03f9c6 100644
--- a/src/lib/components/displays/RelayDisplay/RelayDisplay.svelte
+++ b/src/lib/components/displays/RelayDisplay/RelayDisplay.svelte
@@ -39,6 +39,7 @@
 	import { formatDateTime } from '$lib/i18n/format';
 	import type { DeviceDisplayProps } from '$lib/interfaces/deviceDisplay';
 	import { m } from '$lib/paraglide/messages.js';
+	import { canManage } from '$lib/constants/permissions';
 
 	let {
 		latestData,
@@ -82,7 +83,7 @@
 	let lastUpdate = $derived(latestRelayRow?.created_at ?? '');
 	let relayOperationsLocked = $derived(hasLockedRelayOperation());
 	let controlNotice = $derived.by(() => {
-		if (permissionLevel > 2) {
+		if (!canManage(permissionLevel)) {
 			return m.devices_relay_controls_requires_permission();
 		}
 		return '';
@@ -207,7 +208,7 @@
 			relayOperationsLocked ||
 			isRelaySubmittingAny(relay) ||
 			!authToken ||
-			permissionLevel > 2 ||
+			!canManage(permissionLevel) ||
 			!queueRelayCommand
 		) {
 			return true;
@@ -226,7 +227,7 @@
 			relayOperationsLocked ||
 			isRelaySubmittingAny(relay) ||
 			!authToken ||
-			permissionLevel > 2 ||
+			!canManage(permissionLevel) ||
 			!queueRelayCommand ||
 			parseTimedOnDurationSeconds() === null
 		) {
@@ -427,7 +428,7 @@
 					max={MAX_RELAY_PULSE_DURATION_SECONDS}
 					step={1}
 					error={timedOnDurationError || undefined}
-					disabled={!authToken || permissionLevel > 2}
+					disabled={!authToken || !canManage(permissionLevel)}
 				/>
 				<div class="relay-timed-on__actions">
 					<CwButton
diff --git a/src/lib/constants/permissions.ts b/src/lib/constants/permissions.ts
new file mode 100644
index 00000000..2ed9d5d8
--- /dev/null
+++ b/src/lib/constants/permissions.ts
@@ -0,0 +1,37 @@
+/**
+ * CropWatch permission model — mirror of the API's
+ * api/src/v1/common/permission-levels.ts. Keep the two files in sync.
+ *
+ * Owner is implicit (cw_locations.owner_id / cw_devices.user_id) and outranks
+ * every level.
+ */
+export const PermissionLevel = {
+	ADMIN: 1,
+	MANAGER: 2,
+	USER: 3,
+	VIEWER: 4,
+	DISABLED: 5
+} as const;
+
+export type PermissionLevel = (typeof PermissionLevel)[keyof typeof PermissionLevel];
+
+export const MIN_PERMISSION_LEVEL: PermissionLevel = PermissionLevel.ADMIN;
+export const MAX_PERMISSION_LEVEL: PermissionLevel = PermissionLevel.DISABLED;
+
+export function canRead(level: number | null | undefined): boolean {
+	return level != null && level < PermissionLevel.DISABLED;
+}
+
+export function canManage(level: number | null | undefined): boolean {
+	return level != null && level <= PermissionLevel.MANAGER;
+}
+
+export function isAdmin(level: number | null | undefined): boolean {
+	return level === PermissionLevel.ADMIN;
+}
+
+export function isValidPermissionLevel(level: number): boolean {
+	return (
+		Number.isInteger(level) && level >= MIN_PERMISSION_LEVEL && level <= MAX_PERMISSION_LEVEL
+	);
+}
diff --git a/src/lib/i18n/options.ts b/src/lib/i18n/options.ts
index fdd07562..ef79c299 100644
--- a/src/lib/i18n/options.ts
+++ b/src/lib/i18n/options.ts
@@ -1,22 +1,25 @@
 import { m } from '$lib/paraglide/messages.js';
 
-export function getPermissionLevelOptions(viewerLabel?: string) {
+export function getPermissionLevelOptions(userLabel?: string) {
 	return [
 		{ label: m.permission_level_admin(), value: '1' },
 		{ label: m.permission_level_manager(), value: '2' },
-		{ label: viewerLabel ?? m.permission_level_user(), value: '3' },
-		{ label: m.permission_level_disabled(), value: '4' }
+		{ label: userLabel ?? m.permission_level_user(), value: '3' },
+		{ label: m.permission_level_viewer(), value: '4' },
+		{ label: m.permission_level_disabled(), value: '5' }
 	];
 }
 
-export function getPermissionLevelLabel(value: string | number, viewerLabel?: string): string {
+export function getPermissionLevelLabel(value: string | number, userLabel?: string): string {
 	switch (String(value)) {
 		case '1':
 			return m.permission_level_admin();
 		case '2':
 			return m.permission_level_manager();
 		case '3':
-			return viewerLabel ?? m.permission_level_user();
+			return userLabel ?? m.permission_level_user();
+		case '4':
+			return m.permission_level_viewer();
 		default:
 			return m.permission_level_disabled();
 	}
@@ -33,32 +36,6 @@ export function getRuleOperatorOptions() {
 	];
 }
 
-export function getRuleNotifierTypeOptions() {
-	return [
-		{ label: m.rule_notifier_email(), value: '1' },
-		{ label: m.rule_notifier_sms(), value: '2' },
-		{ label: m.rule_notifier_push(), value: '3' },
-		{ label: m.rule_notifier_discord(), value: '4' }
-	];
-}
-
-export function getRuleSendMethodOptions() {
-	return [
-		{ label: m.rule_send_email(), value: 'email' },
-		{ label: m.rule_send_sms(), value: 'sms' },
-		{ label: m.rule_send_both(), value: 'both' }
-	];
-}
-
-export function getRuleTemplateActionTypeOptions() {
-	return [
-		{ label: m.rule_notifier_email(), value: 'email' },
-		{ label: m.rule_notifier_sms(), value: 'sms' },
-		{ label: m.rule_notifier_push(), value: 'push' },
-		{ label: m.rule_notifier_discord(), value: 'discord' }
-	];
-}
-
 export function getRuleSubjectOptions() {
 	return [
 		{ label: m.rule_subject_temperature(), value: 'temperature_c' },
diff --git a/src/routes/+layout.server.ts b/src/routes/+layout.server.ts
index 483ef6b5..2c589210 100644
--- a/src/routes/+layout.server.ts
+++ b/src/routes/+layout.server.ts
@@ -1,5 +1,5 @@
 import { ApiService } from '$lib/api/api.service';
-import type { DeviceStatusSummary, RuleDto } from '$lib/api/api.dtos';
+import type { DeviceStatusSummary, RuleTemplateDto } from '$lib/api/api.dtos';
 import type { LayoutServerLoad } from './$types';
 
 const EMPTY_DEVICE_STATUSES: DeviceStatusSummary = { online: 0, offline: 0 };
@@ -23,7 +23,7 @@ function readTriggeredRulesCount(rawTriggeredRulesCount: unknown): number {
 
 async function loadOverviewData(apiServiceInstance: ApiService): Promise<{
 	deviceStatuses: DeviceStatusSummary;
-	triggeredRules: RuleDto[];
+	triggeredRules: RuleTemplateDto[];
 	triggeredRulesCount: number;
 }> {
 	const [deviceStatusesResult, triggeredRulesResult, triggeredRulesCountResult] =
@@ -65,7 +65,7 @@ export const load: LayoutServerLoad = async ({ locals, fetch }) => {
 	let profile;
 	let overview = {
 		deviceStatuses: EMPTY_DEVICE_STATUSES,
-		triggeredRules: [] as RuleDto[],
+		triggeredRules: [] as RuleTemplateDto[],
 		triggeredRulesCount: 0
 	};
 
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 43f8e2ac..23af5280 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -17,7 +17,7 @@
 	import OverviewDrawer from './OverviewDrawer.svelte';
 	import Sidebar from './Sidebar.svelte';
 	import { createAppContext, setAppContext } from '$lib/appContext.svelte';
-	import type { DeviceStatusSummary, RuleDto } from '$lib/api/api.dtos';
+	import type { DeviceStatusSummary, RuleTemplateDto } from '$lib/api/api.dtos';
 	import type { IJWT } from '$lib/interfaces/jwt.interface';
 	import type { LayoutProps } from './$types';
 	import Header from './Header.svelte';
@@ -38,7 +38,7 @@
 		profile?: Profile | undefined;
 		overview?: {
 			deviceStatuses: DeviceStatusSummary;
-			triggeredRules: RuleDto[];
+			triggeredRules: RuleTemplateDto[];
 			triggeredRulesCount: number;
 		};
 	}
diff --git a/src/routes/Header.svelte b/src/routes/Header.svelte
index 969a2e15..d90db339 100644
--- a/src/routes/Header.svelte
+++ b/src/routes/Header.svelte
@@ -19,7 +19,6 @@
 
 	const menuItems = $derived([
 		{ id: 'profile', label: m.nav_profile() },
-		{ id: 'billing', label: m.nav_billing() },
 		{ id: 'settings', label: m.nav_settings() },
 		{ id: 'logout', label: m.nav_logout(), separator: true, danger: true }
 	]);
@@ -73,8 +72,6 @@
 					goto(resolve('/account/profile'));
 				} else if (event.id === 'settings') {
 					goto(resolve('/settings'));
-				} else if (event.id === 'billing') {
-					goto(resolve('/account/billing'));
 				}
 			}}
 		/>
diff --git a/src/routes/OverviewDrawer.svelte b/src/routes/OverviewDrawer.svelte
index 0b5beb42..4ee6572d 100644
--- a/src/routes/OverviewDrawer.svelte
+++ b/src/routes/OverviewDrawer.svelte
@@ -48,12 +48,21 @@
 	]);
 	let triggeredRules = $derived(Array.isArray(app?.triggeredRules) ? app.triggeredRules : []);
 	let alerts = $derived<AlertRow[]>(
-		triggeredRules.map((rule) => ({
-			id: String(rule.id),
-			icon: '🔔',
-			name: rule.name,
-			reported: rule.last_triggered ? formatDateTime(rule.last_triggered) : m.common_not_available()
-		}))
+		triggeredRules.map((rule) => {
+			// Triggered templates carry per-device state; show the most recent trigger time.
+			const lastTriggeredAt = rule.assignments
+				.map((assignment) => assignment.state?.lastTriggeredAt)
+				.filter((value): value is string => typeof value === 'string')
+				.sort()
+				.at(-1);
+
+			return {
+				id: String(rule.id),
+				icon: '🔔',
+				name: rule.name,
+				reported: lastTriggeredAt ? formatDateTime(lastTriggeredAt) : m.common_not_available()
+			};
+		})
 	);
 </script>
 
diff --git a/src/routes/Sidebar.svelte b/src/routes/Sidebar.svelte
index c2e72c9c..fd163578 100644
--- a/src/routes/Sidebar.svelte
+++ b/src/routes/Sidebar.svelte
@@ -62,13 +62,6 @@
 			icon: { path: RULES_ICON_PATH },
 			group: m.nav_group_info_management()
 		},
-		{
-			id: 'rules-new',
-			label: `${m.nav_rules()} (beta)`,
-			href: '/rules-new',
-			icon: { path: RULES_ICON_PATH },
-			group: m.nav_group_info_management()
-		},
 		{
 			id: 'reports',
 			label: m.nav_reports(),
@@ -76,13 +69,6 @@
 			icon: { path: REPORTS_ICON_PATH },
 			group: m.nav_group_info_management()
 		},
-		{
-			id: 'reports-new',
-			label: `${m.nav_reports()} (beta)`,
-			href: '/reports-new',
-			icon: { path: REPORTS_ICON_PATH },
-			group: m.nav_group_info_management()
-		},
 		{
 			id: 'gateways',
 			label: m.nav_gateways(),
diff --git a/src/routes/account/billing/+page.server.ts b/src/routes/account/billing/+page.server.ts
deleted file mode 100644
index b543859b..00000000
--- a/src/routes/account/billing/+page.server.ts
+++ /dev/null
@@ -1,542 +0,0 @@
-import { ApiService, ApiServiceError } from '$lib/api/api.service';
-import { formatCurrency } from '$lib/i18n/format';
-import { m } from '$lib/paraglide/messages.js';
-import { buildLoginPath } from '$lib/utils/auth-redirect';
-import { fail, redirect } from '@sveltejs/kit';
-import type { Actions, PageServerLoad } from './$types';
-
-type UnknownRecord = Record<string, unknown>;
-
-type BillingProduct = {
-	id: string;
-	name: string;
-	description: string;
-	priceLabel: string;
-	billingLabel: string;
-	active: boolean;
-};
-
-type BillingSubscription = {
-	id: string;
-	status: string;
-	productName: string;
-	startedAt: string | null;
-	renewsAt: string | null;
-	canceledAt: string | null;
-	amountLabel: string;
-};
-
-type BillingState = {
-	status: string;
-	hasActiveSubscription: boolean;
-	customerId: string | null;
-	activeSubscriptionCount: number;
-	trialSubscriptionCount: number;
-	cancelledSubscriptionCount: number;
-};
-
-type EndpointResult = {
-	data: unknown;
-	error: string | null;
-};
-
-const isRecord = (value: unknown): value is UnknownRecord =>
-	typeof value === 'object' && value !== null && !Array.isArray(value);
-
-const asString = (value: unknown): string | null => {
-	if (typeof value === 'string') {
-		const trimmed = value.trim();
-		return trimmed.length > 0 ? trimmed : null;
-	}
-	if (typeof value === 'number' && Number.isFinite(value)) {
-		return String(value);
-	}
-	return null;
-};
-
-const asNumber = (value: unknown): number | null => {
-	if (typeof value === 'number' && Number.isFinite(value)) return value;
-	if (typeof value === 'string') {
-		const parsed = Number(value);
-		return Number.isFinite(parsed) ? parsed : null;
-	}
-	return null;
-};
-
-const asBoolean = (value: unknown): boolean | null => {
-	if (typeof value === 'boolean') return value;
-	if (typeof value === 'string') {
-		const normalized = value.trim().toLowerCase();
-		if (normalized === 'true') return true;
-		if (normalized === 'false') return false;
-	}
-	return null;
-};
-
-const getPathValue = (record: UnknownRecord, path: string[]): unknown => {
-	let current: unknown = record;
-	for (const segment of path) {
-		if (!isRecord(current)) return undefined;
-		current = current[segment];
-	}
-	return current;
-};
-
-const getPathFromUnknown = (value: unknown, path: string): unknown => {
-	const segments = path.split('.');
-	let current: unknown = value;
-	for (const segment of segments) {
-		if (!isRecord(current)) return undefined;
-		current = current[segment];
-	}
-	return current;
-};
-
-const toIsoStringOrNull = (value: unknown): string | null => {
-	if (typeof value === 'number' && Number.isFinite(value)) {
-		const fromNumber = new Date(value);
-		return Number.isNaN(fromNumber.getTime()) ? null : fromNumber.toISOString();
-	}
-	const text = asString(value);
-	if (!text) return null;
-	const parsed = new Date(text);
-	return Number.isNaN(parsed.getTime()) ? null : parsed.toISOString();
-};
-
-const extractRecords = (payload: unknown, keys: string[]): UnknownRecord[] => {
-	if (Array.isArray(payload)) {
-		return payload.filter(isRecord);
-	}
-	if (!isRecord(payload)) {
-		return [];
-	}
-
-	for (const key of keys) {
-		const value = getPathFromUnknown(payload, key);
-		if (Array.isArray(value)) {
-			const records = value.filter(isRecord);
-			if (records.length > 0) return records;
-		}
-	}
-
-	return [];
-};
-
-const extractPriceRecord = (source: UnknownRecord): UnknownRecord | null => {
-	if (Array.isArray(source.prices)) {
-		const firstPrice = source.prices.find(isRecord);
-		if (firstPrice) return firstPrice;
-	}
-	if (isRecord(source.price)) return source.price;
-	if (isRecord(source.product_price)) return source.product_price;
-	return null;
-};
-
-const extractPriceLabel = (source: UnknownRecord): { priceLabel: string; billingLabel: string } => {
-	const price = extractPriceRecord(source);
-	const amountMinor =
-		asNumber(price?.price_amount) ??
-		asNumber(price?.amount) ??
-		asNumber(source.price_amount) ??
-		asNumber(source.amount);
-	const currency =
-		asString(price?.price_currency) ??
-		asString(price?.currency) ??
-		asString(source.price_currency) ??
-		asString(source.currency) ??
-		'USD';
-	const interval =
-		asString(price?.recurring_interval) ??
-		asString(price?.interval) ??
-		asString(source.recurring_interval) ??
-		asString(source.interval);
-
-	const priceLabel =
-		amountMinor === null ? m.billing_custom_pricing() : formatCurrency(amountMinor / 100, currency);
-	const billingLabel = interval ? m.billing_billed_interval({ interval }) : m.billing_one_time();
-	return { priceLabel, billingLabel };
-};
-
-const normalizeProducts = (payload: unknown): BillingProduct[] => {
-	const items = extractRecords(payload, [
-		'items',
-		'products',
-		'data',
-		'result',
-		'result.items',
-		'result.products',
-		'data.items',
-		'data.products'
-	]);
-	return items.flatMap((item) => {
-		const base = isRecord(item.product) ? item.product : item;
-		const id =
-			asString(base.id) ??
-			asString(base.product_id) ??
-			asString(base.productId) ??
-			asString(base.uuid) ??
-			asString(item.id);
-		if (!id) return [];
-
-		const name =
-			asString(base.name) ??
-			asString(base.title) ??
-			asString(base.display_name) ??
-			asString(getPathValue(base, ['metadata', 'name'])) ??
-			asString(getPathValue(item, ['metadata', 'name'])) ??
-			id;
-		const description =
-			asString(base.description) ??
-			asString(getPathValue(base, ['metadata', 'description'])) ??
-			asString(getPathValue(item, ['metadata', 'description'])) ??
-			'';
-		const active =
-			(asBoolean(base.active) ?? asBoolean(item.active) ?? true) &&
-			!(asBoolean(base.archived) ?? asBoolean(item.archived) ?? false) &&
-			!(asBoolean(base.is_archived) ?? asBoolean(item.is_archived) ?? false);
-		const pricing = extractPriceLabel(isRecord(item.product) ? { ...base, ...item } : item);
-
-		return [
-			{
-				id,
-				name,
-				description,
-				priceLabel: pricing.priceLabel,
-				billingLabel: pricing.billingLabel,
-				active
-			}
-		];
-	});
-};
-
-const normalizeSubscriptions = (payload: unknown): BillingSubscription[] => {
-	const items = extractRecords(payload, [
-		'items',
-		'subscriptions',
-		'data',
-		'result',
-		'result.items',
-		'result.subscriptions',
-		'data.items',
-		'data.subscriptions'
-	]);
-	return items.flatMap((item) => {
-		const id = asString(item.id) ?? asString(item.subscription_id) ?? asString(item.subscriptionId);
-		if (!id) return [];
-
-		const status =
-			asString(item.status) ??
-			asString(item.state) ??
-			asString(item.subscription_status) ??
-			m.billing_status_unknown();
-		const productName =
-			asString(getPathValue(item, ['product', 'name'])) ??
-			asString(getPathValue(item, ['product', 'display_name'])) ??
-			asString(getPathValue(item, ['price', 'product', 'name'])) ??
-			asString(getPathValue(item, ['product_price', 'product', 'name'])) ??
-			asString(item.product_name) ??
-			asString(item.productName) ??
-			m.billing_unknown_plan();
-		const startedAt =
-			toIsoStringOrNull(item.started_at) ??
-			toIsoStringOrNull(item.start_date) ??
-			toIsoStringOrNull(item.current_period_start);
-		const renewsAt =
-			toIsoStringOrNull(item.current_period_end) ??
-			toIsoStringOrNull(item.renews_at) ??
-			toIsoStringOrNull(item.ends_at);
-		const canceledAt =
-			toIsoStringOrNull(item.canceled_at) ??
-			toIsoStringOrNull(item.cancel_at) ??
-			toIsoStringOrNull(item.revoked_at);
-		const pricing = extractPriceLabel(item);
-
-		return [
-			{
-				id,
-				status,
-				productName,
-				startedAt,
-				renewsAt,
-				canceledAt,
-				amountLabel: pricing.priceLabel
-			}
-		];
-	});
-};
-
-const normalizeState = (payload: unknown): BillingState => {
-	const state = isRecord(payload) ? payload : {};
-	const activeSubscriptionCount =
-		asNumber(state.active_subscription_count) ?? asNumber(state.activeSubscriptionCount) ?? 0;
-	const trialSubscriptionCount =
-		asNumber(state.trial_subscription_count) ?? asNumber(state.trialSubscriptionCount) ?? 0;
-	const cancelledSubscriptionCount =
-		asNumber(state.cancelled_subscription_count) ?? asNumber(state.cancelledSubscriptionCount) ?? 0;
-	const hasActiveSubscription =
-		asBoolean(state.has_active_subscription) ??
-		asBoolean(state.hasActiveSubscription) ??
-		activeSubscriptionCount + trialSubscriptionCount > 0;
-	const customerId =
-		asString(state.customer_id) ??
-		asString(state.customerId) ??
-		asString(getPathValue(state, ['customer', 'id']));
-	const status = asString(state.status) ?? m.billing_status_unknown();
-
-	return {
-		status,
-		hasActiveSubscription,
-		customerId,
-		activeSubscriptionCount,
-		trialSubscriptionCount,
-		cancelledSubscriptionCount
-	};
-};
-
-const readApiError = (payload: unknown, fallback: string): string => {
-	if (isRecord(payload)) {
-		const message = payload.message;
-		if (Array.isArray(message)) {
-			const fromArray = message.map(asString).filter(Boolean).join(', ');
-			if (fromArray.length > 0) return fromArray;
-		}
-		const fromField = asString(message);
-		if (fromField) return fromField;
-	}
-	return fallback;
-};
-
-const executeApiRequest = async (
-	request: () => Promise<unknown>,
-	fallback: string
-): Promise<EndpointResult> => {
-	try {
-		return { data: await request(), error: null };
-	} catch (error) {
-		return {
-			data: null,
-			error:
-				error instanceof ApiServiceError
-					? readApiError(error.payload, fallback)
-					: error instanceof Error
-						? error.message
-						: fallback
-		};
-	}
-};
-
-const findRedirectUrl = (payload: unknown): string | null => {
-	if (typeof payload === 'string' && /^https?:\/\//i.test(payload)) {
-		return payload;
-	}
-	if (Array.isArray(payload)) {
-		for (const item of payload) {
-			const fromArray = findRedirectUrl(item);
-			if (fromArray) return fromArray;
-		}
-		return null;
-	}
-	if (!isRecord(payload)) return null;
-
-	const directKeys = [
-		'url',
-		'checkout_url',
-		'checkoutUrl',
-		'portal_url',
-		'portalUrl',
-		'customer_portal_url',
-		'customerPortalUrl'
-	];
-	for (const key of directKeys) {
-		const candidate = asString(payload[key]);
-		if (candidate && /^https?:\/\//i.test(candidate)) return candidate;
-	}
-
-	for (const value of Object.values(payload)) {
-		const nested = findRedirectUrl(value);
-		if (nested) return nested;
-	}
-	return null;
-};
-
-const requireAuth = (jwt: string | null, redirectTarget: string) => {
-	if (!jwt) {
-		throw redirect(
-			303,
-			buildLoginPath({
-				redirectTo: redirectTarget,
-				reason: 'auth-required'
-			})
-		);
-	}
-};
-
-export const load: PageServerLoad = async ({ fetch, locals, url }) => {
-	requireAuth(locals.jwtString, `${url.pathname}${url.search}`);
-	const api = new ApiService({
-		fetchFn: fetch,
-		authToken: locals.jwtString
-	});
-
-	const [productsResult, subscriptionsResult, stateResult] = await Promise.all([
-		executeApiRequest(() => api.getPaymentsProducts(), m.billing_load_products_failed()),
-		executeApiRequest(() => api.getPaymentsSubscriptions(), m.billing_load_subscriptions_failed()),
-		executeApiRequest(() => api.getPaymentsSubscriptionState(), m.billing_load_state_failed())
-	]);
-
-	const subscriptions = normalizeSubscriptions(subscriptionsResult.data);
-
-	return {
-		products: normalizeProducts(productsResult.data),
-		subscriptions,
-		subscriptionState: normalizeState(stateResult.data),
-		errors: {
-			products: productsResult.error,
-			subscriptions: subscriptionsResult.error,
-			state: stateResult.error
-		}
-	};
-};
-
-export const actions: Actions = {
-	createCheckoutSession: async ({ request, fetch, url, locals }) => {
-		requireAuth(locals.jwtString, `${url.pathname}${url.search}`);
-		const api = new ApiService({
-			fetchFn: fetch,
-			authToken: locals.jwtString
-		});
-
-		const formData = await request.formData();
-		const products = formData
-			.getAll('products')
-			.map((value) => String(value).trim())
-			.filter((value) => value.length > 0);
-
-		if (products.length === 0) {
-			return fail(400, {
-				action: 'checkout',
-				message: m.billing_select_product_before_checkout()
-			});
-		}
-
-		const customerName = asString(formData.get('customer_name'));
-		const customerEmail = asString(formData.get('customer_email'));
-		const allowDiscountCodes = asBoolean(formData.get('allow_discount_codes')) ?? true;
-		const allowTrial = asBoolean(formData.get('allow_trial')) ?? true;
-		const returnUrl = asString(formData.get('return_url')) ?? `${url.origin}/account/billing`;
-		const successUrl =
-			asString(formData.get('success_url')) ?? `${url.origin}/account/billing?checkout=success`;
-
-		const payload: UnknownRecord = {
-			products,
-			return_url: returnUrl,
-			success_url: successUrl,
-			allow_discount_codes: allowDiscountCodes,
-			allow_trial: allowTrial
-		};
-		if (customerName) payload.customer_name = customerName;
-		if (customerEmail) payload.customer_email = customerEmail;
-
-		let responsePayload: unknown;
-		try {
-			responsePayload = await api.createPaymentsCheckoutSession(payload);
-		} catch (error) {
-			return fail(error instanceof ApiServiceError ? error.status : 502, {
-				action: 'checkout',
-				message: readApiError(
-					error instanceof ApiServiceError ? error.payload : error,
-					m.billing_checkout_session_failed()
-				)
-			});
-		}
-
-		const redirectUrl = findRedirectUrl(responsePayload);
-		if (!redirectUrl) {
-			return fail(502, {
-				action: 'checkout',
-				message: m.billing_checkout_redirect_missing()
-			});
-		}
-
-		return {
-			action: 'checkout',
-			message: m.billing_checkout_session_created(),
-			redirectUrl
-		};
-	},
-
-	createPortalSession: async ({ request, fetch, url, locals }) => {
-		requireAuth(locals.jwtString, `${url.pathname}${url.search}`);
-		const api = new ApiService({
-			fetchFn: fetch,
-			authToken: locals.jwtString
-		});
-
-		const formData = await request.formData();
-		const returnUrl = asString(formData.get('return_url')) ?? `${url.origin}/account/billing`;
-		const payload = { return_url: returnUrl };
-
-		let responsePayload: unknown;
-		try {
-			responsePayload = await api.createPaymentsPortalSession(payload);
-		} catch (error) {
-			return fail(error instanceof ApiServiceError ? error.status : 502, {
-				action: 'portal',
-				message: readApiError(
-					error instanceof ApiServiceError ? error.payload : error,
-					m.billing_portal_open_failed()
-				)
-			});
-		}
-
-		const redirectUrl = findRedirectUrl(responsePayload);
-		if (!redirectUrl) {
-			return fail(502, {
-				action: 'portal',
-				message: m.billing_portal_redirect_missing()
-			});
-		}
-
-		return {
-			action: 'portal',
-			message: m.billing_portal_session_created(),
-			redirectUrl
-		};
-	},
-
-	cancelSubscription: async ({ request, fetch, locals, url }) => {
-		requireAuth(locals.jwtString, `${url.pathname}${url.search}`);
-		const api = new ApiService({
-			fetchFn: fetch,
-			authToken: locals.jwtString
-		});
-
-		const formData = await request.formData();
-		const subscriptionId = asString(formData.get('subscription_id'));
-
-		if (!subscriptionId) {
-			return fail(400, {
-				action: 'cancel',
-				message: m.billing_subscription_id_required()
-			});
-		}
-
-		try {
-			await api.cancelPaymentsSubscription(subscriptionId);
-		} catch (error) {
-			return fail(error instanceof ApiServiceError ? error.status : 502, {
-				action: 'cancel',
-				message: readApiError(
-					error instanceof ApiServiceError ? error.payload : error,
-					m.billing_subscription_cancel_failed()
-				)
-			});
-		}
-
-		return {
-			action: 'cancel',
-			message: m.billing_subscription_canceled(),
-			cancelledId: subscriptionId
-		};
-	}
-};
diff --git a/src/routes/account/billing/+page.svelte b/src/routes/account/billing/+page.svelte
deleted file mode 100644
index 800ede22..00000000
--- a/src/routes/account/billing/+page.svelte
+++ /dev/null
@@ -1,815 +0,0 @@
-<script lang="ts">
-	import { applyAction, enhance } from '$app/forms';
-	import { AppActionRow, AppFormStack, AppNotice, AppPage } from '$lib/components/layout';
-	import type { ActionResult, SubmitFunction } from '@sveltejs/kit';
-	import {
-		CwButton,
-		CwCard,
-		CwChip,
-		CwCopy,
-		CwDataTable,
-		CwDialog,
-		CwExpandPanel,
-		CwInput,
-		CwSwitch,
-		useCwToast,
-		type CwColumnDef,
-		type CwTableQuery,
-		type CwTableResult,
-		type CwTone
-	} from '@cropwatchdevelopment/cwui';
-	import { formatDateTime, formatNumber } from '$lib/i18n/format';
-	import { cwCopyLabels, cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import { m } from '$lib/paraglide/messages.js';
-	import type { PageProps } from './$types';
-
-	type BillingProduct = {
-		id: string;
-		name: string;
-		description: string;
-		priceLabel: string;
-		billingLabel: string;
-		active: boolean;
-	};
-
-	type BillingSubscription = {
-		id: string;
-		status: string;
-		productName: string;
-		startedAt: string | null;
-		renewsAt: string | null;
-		canceledAt: string | null;
-		amountLabel: string;
-	};
-
-	type BillingState = {
-		status: string;
-		hasActiveSubscription: boolean;
-		customerId: string | null;
-		activeSubscriptionCount: number;
-		trialSubscriptionCount: number;
-		cancelledSubscriptionCount: number;
-	};
-
-	type BillingFormPayload = {
-		action?: string;
-		message?: string;
-		redirectUrl?: string;
-		cancelledId?: string;
-	};
-
-	type ActionPayloadResult = Extract<ActionResult, { type: 'success' | 'failure' }>;
-
-	let { data, form }: PageProps = $props();
-	const toast = useCwToast();
-
-	$effect(() => {
-		if (
-			form &&
-			typeof form === 'object' &&
-			typeof form.message === 'string' &&
-			form.message.length > 0
-		) {
-			const tone: CwTone = form.action === 'cancel' ? 'warning' : 'info';
-			toast.add({ tone, message: form.message });
-		}
-	});
-
-	let selectedProductIds = $state<string[]>([]);
-	let showArchivedProducts = $state(true);
-	let customerName = $state('');
-	let customerEmail = $state('');
-	let allowDiscountCodes = $state(true);
-	let allowTrial = $state(true);
-
-	let checkoutBusy = $state(false);
-	let portalBusy = $state(false);
-	let cancelBusy = $state(false);
-	let cancelDialogOpen = $state(false);
-	let subscriptionToCancel = $state<BillingSubscription | null>(null);
-
-	let pageSize = $state(6);
-
-	let products = $derived((data.products ?? []) as BillingProduct[]);
-	let subscriptions = $derived((data.subscriptions ?? []) as BillingSubscription[]);
-	let subscriptionState = $derived((data.subscriptionState ?? {}) as BillingState);
-	let visibleProducts = $derived(
-		showArchivedProducts ? products : products.filter((product) => product.active)
-	);
-
-	const hasLoadErrors = $derived(
-		Boolean(data.errors?.products || data.errors?.subscriptions || data.errors?.state)
-	);
-
-	const subscriptionColumns: CwColumnDef<BillingSubscription>[] = [
-		{ key: 'productName', header: m.billing_column_plan(), sortable: true },
-		{ key: 'status', header: m.billing_column_status(), sortable: true, width: '10rem' },
-		{
-			key: 'amountLabel',
-			header: m.billing_column_price(),
-			sortable: true,
-			width: '9rem',
-			hideBelow: 'sm'
-		},
-		{
-			key: 'startedAt',
-			header: m.billing_column_started(),
-			sortable: true,
-			width: '12rem',
-			hideBelow: 'md'
-		},
-		{
-			key: 'renewsAt',
-			header: m.billing_column_renews(),
-			sortable: true,
-			width: '12rem',
-			hideBelow: 'md'
-		}
-	];
-
-	const toPayload = (result: ActionPayloadResult): BillingFormPayload => {
-		if (result.data && typeof result.data === 'object' && !Array.isArray(result.data)) {
-			return result.data as BillingFormPayload;
-		}
-		return {};
-	};
-
-	const maybeToast = (tone: CwTone, message: string | undefined, fallback: string) => {
-		toast.add({ tone, message: message?.trim() || fallback });
-	};
-
-	function isProductSelected(productId: string): boolean {
-		return selectedProductIds.includes(productId);
-	}
-
-	function toggleProductSelection(productId: string, checked: boolean) {
-		if (checked) {
-			if (!selectedProductIds.includes(productId)) {
-				selectedProductIds = [...selectedProductIds, productId];
-			}
-			return;
-		}
-		selectedProductIds = selectedProductIds.filter((id) => id !== productId);
-	}
-
-	function clearProductSelection() {
-		selectedProductIds = [];
-	}
-
-	function formatDate(value: string | null): string {
-		return formatDateTime(value ?? '', undefined, m.common_not_available());
-	}
-
-	function subscriptionTone(status: string): CwTone {
-		const normalized = status.toLowerCase();
-		if (normalized.includes('active')) return 'success';
-		if (normalized.includes('trial')) return 'info';
-		if (normalized.includes('cancel') || normalized.includes('revoke')) return 'danger';
-		if (normalized.includes('past') || normalized.includes('unpaid')) return 'warning';
-		return 'secondary';
-	}
-
-	function translateSubscriptionStatus(status: string): string {
-		const normalized = status.toLowerCase();
-		if (normalized.includes('active')) return m.billing_status_active();
-		if (normalized.includes('trial')) return m.billing_status_trial();
-		if (normalized.includes('cancel') || normalized.includes('revoke')) {
-			return m.billing_status_canceled();
-		}
-		if (normalized.includes('past')) return m.billing_status_past_due();
-		if (normalized.includes('unpaid')) return m.billing_status_unpaid();
-		if (normalized.includes('unknown')) return m.billing_status_unknown();
-		return status;
-	}
-
-	function accountStateTone(): CwTone {
-		return subscriptionState.hasActiveSubscription ? 'success' : 'warning';
-	}
-
-	function openCancelDialog(subscription: BillingSubscription) {
-		subscriptionToCancel = subscription;
-		cancelDialogOpen = true;
-	}
-
-	function closeCancelDialog() {
-		cancelDialogOpen = false;
-		subscriptionToCancel = null;
-	}
-
-	function getSortValue(row: BillingSubscription, key: string): string {
-		switch (key) {
-			case 'productName':
-				return row.productName.toLowerCase();
-			case 'status':
-				return row.status.toLowerCase();
-			case 'amountLabel':
-				return row.amountLabel.toLowerCase();
-			case 'startedAt':
-				return row.startedAt ?? '';
-			case 'renewsAt':
-				return row.renewsAt ?? '';
-			default:
-				return '';
-		}
-	}
-
-	async function loadSubscriptions(
-		query: CwTableQuery
-	): Promise<CwTableResult<BillingSubscription>> {
-		let rows = [...subscriptions];
-		const normalizedSearch = query.search.trim().toLowerCase();
-
-		if (normalizedSearch.length > 0) {
-			rows = rows.filter((row) =>
-				`${row.productName} ${row.status} ${row.amountLabel} ${row.id}`
-					.toLowerCase()
-					.includes(normalizedSearch)
-			);
-		}
-
-		if (query.sort) {
-			rows.sort((a, b) => {
-				const aValue = getSortValue(a, query.sort!.column);
-				const bValue = getSortValue(b, query.sort!.column);
-				const result = aValue.localeCompare(bValue);
-				return query.sort!.direction === 'asc' ? result : -result;
-			});
-		}
-
-		const start = (query.page - 1) * query.pageSize;
-		return {
-			rows: rows.slice(start, start + query.pageSize),
-			total: rows.length
-		};
-	}
-
-	const checkoutEnhance: SubmitFunction = ({ cancel }) => {
-		if (selectedProductIds.length === 0) {
-			maybeToast('warning', undefined, m.billing_select_product_before_checkout());
-			cancel();
-			return;
-		}
-
-		checkoutBusy = true;
-		return async ({ result, update }) => {
-			checkoutBusy = false;
-
-			if (result.type === 'success' || result.type === 'failure') {
-				await update();
-				const payload = toPayload(result);
-
-				if (result.type === 'success') {
-					maybeToast('success', payload.message, m.billing_checkout_session_created());
-					if (payload.redirectUrl) {
-						window.location.assign(payload.redirectUrl);
-					}
-				} else {
-					maybeToast('danger', payload.message, m.billing_checkout_session_failed());
-				}
-				return;
-			}
-
-			await applyAction(result);
-		};
-	};
-
-	const portalEnhance: SubmitFunction = () => {
-		portalBusy = true;
-		return async ({ result, update }) => {
-			portalBusy = false;
-
-			if (result.type === 'success' || result.type === 'failure') {
-				await update();
-				const payload = toPayload(result);
-
-				if (result.type === 'success') {
-					maybeToast('success', payload.message, m.billing_portal_opened());
-					if (payload.redirectUrl) {
-						window.location.assign(payload.redirectUrl);
-					}
-				} else {
-					maybeToast('danger', payload.message, m.billing_portal_open_failed());
-				}
-				return;
-			}
-
-			await applyAction(result);
-		};
-	};
-
-	const cancelEnhance: SubmitFunction = () => {
-		cancelBusy = true;
-		return async ({ result, update }) => {
-			cancelBusy = false;
-
-			if (result.type === 'success' || result.type === 'failure') {
-				await update();
-				const payload = toPayload(result);
-
-				if (result.type === 'success') {
-					maybeToast('warning', payload.message, m.billing_subscription_canceled());
-					closeCancelDialog();
-				} else {
-					maybeToast('danger', payload.message, m.billing_subscription_cancel_failed());
-				}
-				return;
-			}
-
-			await applyAction(result);
-		};
-	};
-</script>
-
-<svelte:head>
-	<title>{m.nav_billing()} - {m.app_name()}</title>
-</svelte:head>
-
-<AppPage width="xl" class="billing-page">
-	<div class="billing-shell">
-		<header class="billing-header">
-			<div class="billing-header__copy">
-				<h1>{m.billing_heading()}</h1>
-				<p>{m.billing_subtitle()}</p>
-			</div>
-			<div class="billing-header__status">
-				<CwChip
-					label={m.billing_account_status({
-						status: translateSubscriptionStatus(
-							subscriptionState.status || m.billing_status_unknown()
-						)
-					})}
-					tone={accountStateTone()}
-					variant="soft"
-				/>
-				{#if subscriptionState.customerId}
-					<CwCopy labels={cwCopyLabels()} value={subscriptionState.customerId}>
-						<code class="billing-customer-id">{subscriptionState.customerId}</code>
-					</CwCopy>
-				{/if}
-			</div>
-		</header>
-
-		<div class="billing-kpis">
-			<CwCard
-				title={m.billing_active_seats()}
-				subtitle={m.billing_active_seats_subtitle()}
-				elevated
-			>
-				<p class="billing-kpi__value">{formatNumber(subscriptionState.activeSubscriptionCount)}</p>
-			</CwCard>
-
-			<CwCard title={m.billing_trial_plans()} subtitle={m.billing_trial_plans_subtitle()} elevated>
-				<p class="billing-kpi__value">{formatNumber(subscriptionState.trialSubscriptionCount)}</p>
-			</CwCard>
-
-			<CwCard title={m.billing_canceled()} subtitle={m.billing_canceled_subtitle()} elevated>
-				<p class="billing-kpi__value">
-					{formatNumber(subscriptionState.cancelledSubscriptionCount)}
-				</p>
-			</CwCard>
-
-			<CwCard
-				title={m.billing_available_products()}
-				elevated
-			>
-				<p class="billing-kpi__value">{formatNumber(products.length)}</p>
-			</CwCard>
-		</div>
-
-		{#if hasLoadErrors}
-			<AppNotice tone="warning" title={m.billing_api_warnings()}>
-				<p>{m.billing_api_warnings_subtitle()}</p>
-				<ul class="billing-errors">
-					{#if data.errors?.products}
-						<li>{m.billing_error_products({ message: data.errors.products })}</li>
-					{/if}
-					{#if data.errors?.subscriptions}
-						<li>{m.billing_error_subscriptions({ message: data.errors.subscriptions })}</li>
-					{/if}
-					{#if data.errors?.state}
-						<li>{m.billing_error_state({ message: data.errors.state })}</li>
-					{/if}
-				</ul>
-			</AppNotice>
-		{/if}
-
-		<div class="billing-grid">
-			<div class="billing-grid__checkout">
-				<CwCard
-					title={m.billing_checkout_title()}
-					subtitle={m.billing_checkout_subtitle()}
-					elevated
-				>
-					<form method="POST" action="?/createCheckoutSession" use:enhance={checkoutEnhance}>
-						<AppFormStack padded class="billing-form">
-							<div class="billing-products">
-								{#if visibleProducts.length === 0}
-									<AppNotice tone="neutral">
-										<p>{m.billing_no_products()}</p>
-									</AppNotice>
-								{:else}
-									{#each visibleProducts as product (product.id)}
-										<article
-											class={[
-												'billing-product',
-												isProductSelected(product.id) && 'billing-product--selected'
-											]}
-										>
-											<div class="billing-product__header">
-												<div>
-													<h3>{product.name}</h3>
-													<p>{product.description || m.billing_no_product_description()}</p>
-												</div>
-												<CwChip
-													label={product.priceLabel}
-													tone={product.active ? 'info' : 'secondary'}
-													variant="outline"
-												/>
-											</div>
-
-											<div class="billing-product__meta">
-												<CwChip label={product.billingLabel} tone="primary" variant="soft" />
-												{#if !product.active}
-													<CwChip label={m.billing_archived()} tone="warning" variant="soft" />
-												{/if}
-											</div>
-
-											<CwSwitch
-												checked={isProductSelected(product.id)}
-												label={m.billing_include_in_checkout()}
-												onchange={(checked) => toggleProductSelection(product.id, checked)}
-											/>
-
-											{#if isProductSelected(product.id)}
-												<input type="hidden" name="products" value={product.id} />
-											{/if}
-										</article>
-									{/each}
-								{/if}
-							</div>
-
-							<div class="billing-form__controls">
-								<CwSwitch
-									checked={showArchivedProducts}
-									label={m.billing_include_archived_products()}
-									onchange={(checked) => (showArchivedProducts = checked)}
-								/>
-								<CwButton
-									type="button"
-									variant="secondary"
-									size="sm"
-									onclick={clearProductSelection}
-								>
-									{m.billing_clear_selection()}
-								</CwButton>
-							</div>
-
-							<CwExpandPanel title={m.billing_optional_checkout_settings()}>
-								<div class="billing-options">
-									<CwInput
-										label={m.billing_customer_name()}
-										value={customerName}
-										placeholder={m.billing_customer_name_placeholder()}
-										oninput={(event) => (customerName = (event.target as HTMLInputElement).value)}
-									/>
-									<CwInput
-										type="email"
-										label={m.billing_customer_email()}
-										value={customerEmail}
-										placeholder={m.billing_customer_email_placeholder()}
-										oninput={(event) => (customerEmail = (event.target as HTMLInputElement).value)}
-									/>
-									<CwSwitch
-										checked={allowDiscountCodes}
-										label={m.billing_allow_discount_codes()}
-										onchange={(checked) => (allowDiscountCodes = checked)}
-									/>
-									<CwSwitch
-										checked={allowTrial}
-										label={m.billing_allow_trial()}
-										onchange={(checked) => (allowTrial = checked)}
-									/>
-								</div>
-							</CwExpandPanel>
-
-							<input
-								type="hidden"
-								name="allow_discount_codes"
-								value={allowDiscountCodes ? 'true' : 'false'}
-							/>
-							<input type="hidden" name="allow_trial" value={allowTrial ? 'true' : 'false'} />
-							{#if customerName}
-								<input type="hidden" name="customer_name" value={customerName} />
-							{/if}
-							{#if customerEmail}
-								<input type="hidden" name="customer_email" value={customerEmail} />
-							{/if}
-
-							<div class="billing-form__submit">
-								<span
-									>{m.billing_selected_count({
-										count: formatNumber(selectedProductIds.length)
-									})}</span
-								>
-								<AppActionRow stackOnMobile={false}>
-									<CwButton
-										type="submit"
-										variant="primary"
-										loading={checkoutBusy}
-										disabled={checkoutBusy || selectedProductIds.length === 0}
-									>
-										{m.billing_launch_checkout()}
-									</CwButton>
-								</AppActionRow>
-							</div>
-						</AppFormStack>
-					</form>
-				</CwCard>
-			</div>
-
-			<CwCard
-				title={m.billing_subscriptions_title()}
-				subtitle={m.billing_subscriptions_subtitle()}
-				elevated
-			>
-				<AppFormStack padded>
-					<AppActionRow stackOnMobile={false} class="billing-subscriptions__actions">
-						<form method="POST" action="?/createPortalSession" use:enhance={portalEnhance}>
-							<CwButton type="submit" variant="info" loading={portalBusy} disabled={portalBusy}
-								>{m.billing_open_portal()}</CwButton
-							>
-						</form>
-					</AppActionRow>
-
-					<CwDataTable labels={cwDataTableLabels()}
-						columns={subscriptionColumns}
-						loadData={loadSubscriptions}
-						rowKey="id"
-						searchable
-						bind:pageSize
-						rowActionsHeader={m.common_actions()}
-					>
-						{#snippet cell(
-							row: BillingSubscription,
-							col: CwColumnDef<BillingSubscription>,
-							defaultValue: string
-						)}
-							{#if col.key === 'status'}
-								<CwChip
-									label={translateSubscriptionStatus(row.status)}
-									tone={subscriptionTone(row.status)}
-									variant="soft"
-								/>
-							{:else if col.key === 'startedAt'}
-								{formatDate(row.startedAt)}
-							{:else if col.key === 'renewsAt'}
-								{formatDate(row.renewsAt)}
-							{:else}
-								{defaultValue}
-							{/if}
-						{/snippet}
-
-						{#snippet rowActions(row: BillingSubscription)}
-							{#if row.status.toLowerCase().includes('cancel') || row.status
-									.toLowerCase()
-									.includes('revoke')}
-								<CwChip label={m.billing_ended()} tone="secondary" variant="soft" />
-							{:else}
-								<CwButton
-									size="sm"
-									variant="danger"
-									disabled={cancelBusy}
-									onclick={() => openCancelDialog(row)}>{m.action_cancel()}</CwButton
-								>
-							{/if}
-						{/snippet}
-					</CwDataTable>
-				</AppFormStack>
-			</CwCard>
-		</div>
-	</div>
-</AppPage>
-
-<CwDialog
-	bind:open={cancelDialogOpen}
-	title={m.billing_cancel_subscription_title()}
-	onclose={closeCancelDialog}
->
-	{#if subscriptionToCancel}
-		<AppFormStack gap="sm">
-			<p class="billing-dialog__text">
-				{m.billing_cancel_subscription_body({
-					productName: subscriptionToCancel.productName,
-					id: subscriptionToCancel.id
-				})}
-			</p>
-			<p class="billing-dialog__text billing-dialog__warning">
-				{m.billing_cancel_subscription_warning()}
-			</p>
-		</AppFormStack>
-	{/if}
-
-	{#snippet actions()}
-		<AppActionRow class="billing-dialog__actions">
-			<CwButton type="button" variant="secondary" onclick={closeCancelDialog}
-				>{m.billing_keep_subscription()}</CwButton
-			>
-			<form method="POST" action="?/cancelSubscription" use:enhance={cancelEnhance}>
-				<input type="hidden" name="subscription_id" value={subscriptionToCancel?.id ?? ''} />
-				<CwButton
-					type="submit"
-					variant="danger"
-					loading={cancelBusy}
-					disabled={!subscriptionToCancel || cancelBusy}
-				>
-					{m.billing_confirm_cancel()}
-				</CwButton>
-			</form>
-		</AppActionRow>
-	{/snippet}
-</CwDialog>
-
-<style>
-	.billing-shell {
-		display: grid;
-		gap: var(--cw-space-4);
-	}
-
-	.billing-header {
-		display: flex;
-		align-items: flex-start;
-		justify-content: space-between;
-		gap: var(--cw-space-4);
-		flex-wrap: wrap;
-	}
-
-	.billing-header__copy {
-		display: grid;
-		gap: var(--cw-space-2);
-	}
-
-	.billing-header h1,
-	.billing-header p {
-		margin: 0;
-	}
-
-	.billing-header h1 {
-		font-size: clamp(1.4rem, 1rem + 1.2vw, 2rem);
-	}
-
-	.billing-header p {
-		color: var(--cw-text-secondary);
-	}
-
-	.billing-header__status {
-		display: flex;
-		align-items: center;
-		gap: var(--cw-space-2);
-		flex-wrap: wrap;
-	}
-
-	.billing-customer-id {
-		font-size: var(--cw-text-xs);
-		padding: 0.3rem 0.5rem;
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-sm);
-		background: var(--cw-bg-subtle);
-		color: var(--cw-text-secondary);
-	}
-
-	.billing-kpis {
-		display: grid;
-		gap: var(--cw-space-3);
-		grid-template-columns: repeat(4, minmax(0, 1fr));
-	}
-
-	.billing-kpi__value {
-		margin: 0;
-		font-size: clamp(1.6rem, 1.2rem + 0.9vw, 2rem);
-		font-weight: var(--cw-font-semibold);
-		letter-spacing: 0.02em;
-	}
-
-	.billing-errors {
-		margin: 0;
-		padding-left: 1.25rem;
-		display: grid;
-		gap: var(--cw-space-2);
-	}
-
-	.billing-grid {
-		display: grid;
-		gap: var(--cw-space-4);
-		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
-		align-items: start;
-	}
-
-	.billing-grid__checkout {
-		min-width: 0;
-	}
-
-	:global(.billing-form) {
-		gap: var(--cw-space-4);
-	}
-
-	.billing-products {
-		display: grid;
-		gap: var(--cw-space-3);
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-	}
-
-	.billing-product {
-		display: grid;
-		gap: var(--cw-space-3);
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.billing-product--selected {
-		border-color: color-mix(in srgb, var(--cw-info-500) 40%, var(--cw-border-muted));
-		box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cw-info-500) 24%, transparent);
-	}
-
-	.billing-product__header {
-		display: flex;
-		justify-content: space-between;
-		align-items: flex-start;
-		gap: var(--cw-space-3);
-	}
-
-	.billing-product__header h3 {
-		margin: 0;
-		font-size: var(--cw-text-base);
-		font-weight: var(--cw-font-semibold);
-	}
-
-	.billing-product__header p {
-		margin: 0.35rem 0 0;
-		font-size: var(--cw-text-sm);
-		color: var(--cw-text-secondary);
-	}
-
-	.billing-product__meta {
-		display: flex;
-		gap: var(--cw-space-2);
-		flex-wrap: wrap;
-	}
-
-	.billing-form__controls {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		gap: var(--cw-space-3);
-		flex-wrap: wrap;
-	}
-
-	.billing-options {
-		display: grid;
-		gap: var(--cw-space-3);
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-	}
-
-	.billing-form__submit {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		gap: var(--cw-space-3);
-		font-size: var(--cw-text-sm);
-		color: var(--cw-text-secondary);
-		flex-wrap: wrap;
-	}
-
-	.billing-dialog__text {
-		margin: 0;
-	}
-
-	.billing-dialog__warning {
-		color: var(--cw-text-secondary);
-		font-size: var(--cw-text-sm);
-	}
-
-	@media (max-width: 1023px) {
-		.billing-grid {
-			grid-template-columns: 1fr;
-		}
-
-		.billing-kpis {
-			grid-template-columns: repeat(2, minmax(0, 1fr));
-		}
-	}
-
-	@media (max-width: 767px) {
-		.billing-products,
-		.billing-options {
-			grid-template-columns: 1fr;
-		}
-	}
-
-	@media (max-width: 639px) {
-		.billing-kpis {
-			grid-template-columns: 1fr;
-		}
-	}
-</style>
diff --git a/src/routes/locations/[location_id]/+page.server.ts b/src/routes/locations/[location_id]/+page.server.ts
index 277f400e..855b5bec 100644
--- a/src/routes/locations/[location_id]/+page.server.ts
+++ b/src/routes/locations/[location_id]/+page.server.ts
@@ -1,4 +1,5 @@
 import { ApiService } from '$lib/api/api.service';
+import { canManage } from '$lib/constants/permissions';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ locals, fetch, params }) => {
@@ -31,7 +32,7 @@ export const load: PageServerLoad = async ({ locals, fetch, params }) => {
 		? currentLocation.cw_location_owners
 		: [];
 	const currentOwner = userId ? owners.find((o) => o.user_id === userId) : null;
-	const hasSettings = currentOwner != null && Number(currentOwner.permission_level) <= 2;
+	const hasSettings = currentOwner != null && canManage(Number(currentOwner.permission_level));
 
 	return {
 		allLocationDevices,
diff --git a/src/routes/locations/[location_id]/+page.svelte b/src/routes/locations/[location_id]/+page.svelte
index 69c1fe0e..8f0bfb41 100644
--- a/src/routes/locations/[location_id]/+page.svelte
+++ b/src/routes/locations/[location_id]/+page.svelte
@@ -2,14 +2,19 @@
 	import Icon from '$lib/components/Icon.svelte';
 	import { AppPage } from '$lib/components/layout';
 	import {
+		attachCwDeviceRefreshVisibility,
+		createCwDeviceRefreshScheduler,
 		CwButton,
 		CwCard,
 		CwCopy,
 		CwDataTable,
 		type CwColumnDef,
+		type CwDeviceFreshness,
 		type CwTableQuery,
 		type CwTableResult
 	} from '@cropwatchdevelopment/cwui';
+	import { ApiService } from '$lib/api/api.service';
+	import { getAppContext } from '$lib/appContext.svelte';
 	import { cwCopyLabels, cwDataTableLabels } from '$lib/i18n/cwuiLabels';
 	import { goto } from '$app/navigation';
 	import { backHref } from '$lib/navigation/backTo';
@@ -33,6 +38,54 @@
 	const offlineThresholdMs = 11 * 60 * 1000;
 	let loading = $state(false);
 
+	const app = getAppContext();
+
+	// Live freshness per device, driven by the refresh scheduler: each device is
+	// refetched when its upload window expires, so the status column updates
+	// without reloading the page.
+	let freshnessByDevEui = $state<Record<string, CwDeviceFreshness>>({});
+	let lastSeenByDevEui = $state<Record<string, string>>({});
+
+	$effect(() => {
+		const authToken = app.accessToken;
+		const devices = data.allLocationDevices ?? [];
+		if (!authToken || devices.length === 0) return;
+
+		const api = new ApiService({ authToken });
+		const scheduler = createCwDeviceRefreshScheduler({
+			// The list endpoint has no per-device upload_interval; default to the
+			// page's historical 10 min + 1 min grace ≈ the old 11-minute threshold.
+			defaultIntervalMinutes: 10,
+			fetcher: async (devEui) => {
+				const latest = await api.getDashboardDeviceLatest(devEui);
+				if (!latest) return null;
+				const createdAt = typeof latest.created_at === 'string' ? latest.created_at : null;
+				return { lastSeenAt: createdAt, data: latest };
+			},
+			onData: (devEui, result) => {
+				if (typeof result.lastSeenAt === 'string') {
+					lastSeenByDevEui[devEui] = result.lastSeenAt;
+				}
+			},
+			onStateChange: (devEui, state) => {
+				freshnessByDevEui[devEui] = state;
+			}
+		});
+
+		scheduler.trackAll(
+			devices.map((device) => ({
+				id: String(device.dev_eui ?? ''),
+				lastSeenAt: device.created_at ?? null
+			}))
+		);
+
+		const detachVisibility = attachCwDeviceRefreshVisibility(scheduler);
+		return () => {
+			detachVisibility();
+			scheduler.destroy();
+		};
+	});
+
 	const selectedLocationId = $derived(page.params.location_id);
 	const selectedLocationName = $derived((page.url.searchParams.get('location_name') ?? '').trim());
 	const locationLabel = $derived(
@@ -45,17 +98,25 @@
 
 	const columns: CwColumnDef<LocationDeviceRow>[] = [
 		{ key: 'name', header: m.devices_device_name(), sortable: true },
+		{ key: 'status', header: m.devices_status(), sortable: true, width: '8rem' },
 		{ key: 'dev_eui', header: 'DevEUI', sortable: true, width: '14rem', hideBelow: 'sm' }
 	];
 
 	const locationDevices = $derived.by(() => {
 		const now = Date.now();
 		return (data.allLocationDevices ?? []).map((device) => {
-			const createdAt = device.created_at ? new Date(device.created_at) : null;
-			const createdAtMs = createdAt?.getTime() ?? NaN;
-			const isOffline = !Number.isFinite(createdAtMs) || now - createdAtMs > offlineThresholdMs;
+			const devEui = String(device.dev_eui ?? '');
+			const lastSeen = lastSeenByDevEui[devEui] ?? device.created_at ?? null;
+			const lastSeenMs = lastSeen ? new Date(lastSeen).getTime() : NaN;
+			const freshness = freshnessByDevEui[devEui];
+			// Scheduler verdict wins once available; otherwise fall back to the
+			// load-time threshold check.
+			const isOffline =
+				freshness === 'stale' ||
+				(freshness === undefined &&
+					(!Number.isFinite(lastSeenMs) || now - lastSeenMs > offlineThresholdMs));
 			return {
-				dev_eui: String(device.dev_eui ?? ''),
+				dev_eui: devEui,
 				name: String(device.name ?? device.dev_eui ?? m.devices_unnamed_device()),
 				status: isOffline ? 'Offline' : 'Online'
 			} satisfies LocationDeviceRow;
diff --git a/src/routes/locations/[location_id]/devices/[dev_eui]/+layout.server.ts b/src/routes/locations/[location_id]/devices/[dev_eui]/+layout.server.ts
index dacf1bd9..95126514 100644
--- a/src/routes/locations/[location_id]/devices/[dev_eui]/+layout.server.ts
+++ b/src/routes/locations/[location_id]/devices/[dev_eui]/+layout.server.ts
@@ -1,4 +1,5 @@
 import { ApiService } from '$lib/api/api.service';
+import { PermissionLevel } from '$lib/constants/permissions';
 import type { LayoutServerLoad } from './$types';
 
 /**
@@ -22,7 +23,7 @@ export const load: LayoutServerLoad = async ({ params, locals }) => {
 			locationId: location_id ?? '',
 			device: null,
 			dataTable: null as string | null,
-			permissionLevel: 4
+			permissionLevel: PermissionLevel.DISABLED
 		};
 	}
 
@@ -39,7 +40,7 @@ export const load: LayoutServerLoad = async ({ params, locals }) => {
 
 		const owners = Array.isArray(location?.cw_location_owners) ? location.cw_location_owners : [];
 		const currentOwner = userId ? owners.find((o) => o.user_id === userId) : null;
-		const permissionLevel = Number(currentOwner?.permission_level) || 4;
+		const permissionLevel = Number(currentOwner?.permission_level) || PermissionLevel.DISABLED;
 
 		// The API response includes a `data_table` field (string) that identifies
 		// which Supabase table this device stores telemetry in. Fall back to null
@@ -62,7 +63,7 @@ export const load: LayoutServerLoad = async ({ params, locals }) => {
 			locationId: location_id,
 			device: null,
 			dataTable: null as string | null,
-			permissionLevel: 4
+			permissionLevel: PermissionLevel.DISABLED
 		};
 	}
 };
diff --git a/src/routes/locations/[location_id]/devices/[dev_eui]/+page.svelte b/src/routes/locations/[location_id]/devices/[dev_eui]/+page.svelte
index 7077f5bf..78068e04 100644
--- a/src/routes/locations/[location_id]/devices/[dev_eui]/+page.svelte
+++ b/src/routes/locations/[location_id]/devices/[dev_eui]/+page.svelte
@@ -12,6 +12,9 @@
 	import { type RelayNumber, type RelayTargetState } from '$lib/devices/relay-types';
 	import { m } from '$lib/paraglide/messages.js';
 	import {
+		attachCwDeviceRefreshVisibility,
+		createCwDeviceRefreshScheduler,
+		normalizeCwUploadIntervalMinutes,
 		CwButton,
 		CwCard,
 		CwDialog,
@@ -21,8 +24,9 @@
 	import { cwResponsiveLineChartLabels } from '$lib/i18n/cwuiLabels';
 	import { appTheme } from '$lib/theme/appTheme.svelte';
 	import { resolveExportTimeZone } from './csvExport';
+	import { canManage, PermissionLevel } from '$lib/constants/permissions';
 	import type { PageProps } from './$types';
-	import { onDestroy } from 'svelte';
+	import { onDestroy, untrack } from 'svelte';
 	import { onAppForeground } from '$lib/utils/onAppForeground';
 	import DeviceDashboardHeader from './DeviceDashboardHeader.svelte';
 	import {
@@ -87,7 +91,7 @@
 	let locationId = $derived(data.locationId ?? '');
 	let authToken = $derived(data.authToken ?? null);
 	let isRelayDevice = $derived(isRelayTable(data.dataTable));
-	let permissionLevel = $derived(Number(data.permissionLevel) || 4);
+	let permissionLevel = $derived(Number(data.permissionLevel) || PermissionLevel.DISABLED);
 	const serverLatestData = $derived(isTelemetryRow(data.latestData) ? data.latestData : null);
 	let clientLatestData = $state<TelemetryRow | null>(null);
 	let latestData = $derived(clientLatestData ?? serverLatestData);
@@ -101,15 +105,10 @@
 		data.device?.upload_interval ?? data.device?.cw_device_type?.default_upload_interval
 	);
 	// `upload_interval` is a Postgres `numeric` column, so Supabase returns it as
-	// a STRING ("15", "-1", …). Naively doing `("-1" || 10) * 60_000` yields
-	// -60000, and `setInterval` clamps a negative delay to 0 — firing the poll in
-	// a tight loop that freezes the tab. Coerce to a number, reject non-positive
-	// / non-finite values, and never poll faster than once per minute.
-	let refreshIntervalMs = $derived.by(() => {
-		const minutes = Number(upload_interval);
-		const safeMinutes = Number.isFinite(minutes) && minutes > 0 ? minutes : 10;
-		return Math.max(60_000, safeMinutes * 60_000);
-	});
+	// a STRING ("15", "-1", …). normalizeCwUploadIntervalMinutes rejects
+	// non-positive / non-finite values so the refresh scheduler falls back to its
+	// own default instead of scheduling a tight loop.
+	let uploadIntervalMinutes = $derived(normalizeCwUploadIntervalMinutes(upload_interval));
 
 	let requestedHistoricalData = $derived(
 		routeStateByKey[routeKey]?.requestedHistoricalData ?? null
@@ -179,20 +178,35 @@
 		destroyRelayStateManager();
 	});
 
-	// Poll the device for fresh telemetry at its own upload cadence. Without this
-	// the page never refreshes on its own (the relay manager only covers relay
-	// devices). `upload_interval` is in minutes; fall back to 10 when unset.
+	// Refetch the device when its own upload window (last seen +
+	// upload_interval + grace) expires, instead of polling on a fixed interval.
+	// While the device stays stale the scheduler retries with capped exponential
+	// backoff; fresh data re-arms it from the new reading. Pauses while the tab
+	// is hidden and reconciles on return.
 	$effect(() => {
 		if (!authToken || !devEui) return;
-		// Defence-in-depth: never schedule a non-positive interval (see the
-		// `refreshIntervalMs` note above) — `setInterval` would clamp it to 0.
-		if (!Number.isFinite(refreshIntervalMs) || refreshIntervalMs <= 0) return;
+		const intervalMinutes = uploadIntervalMinutes;
+
+		const scheduler = createCwDeviceRefreshScheduler({
+			fetcher: async () => {
+				const row = await refreshDisplayedData();
+				return { lastSeenAt: row ? readCreatedAt(row) : null, data: row };
+			}
+		});
 
-		const timer = setInterval(() => {
-			void refreshDisplayedData();
-		}, refreshIntervalMs);
+		untrack(() => {
+			scheduler.track({
+				id: devEui,
+				lastSeenAt: lastUpdatedAt ?? null,
+				uploadIntervalMinutes: intervalMinutes
+			});
+		});
 
-		return () => clearInterval(timer);
+		const detachVisibility = attachCwDeviceRefreshVisibility(scheduler);
+		return () => {
+			detachVisibility();
+			scheduler.destroy();
+		};
 	});
 
 	function syncRelayStateBaseData(): void {
@@ -374,7 +388,7 @@
 			!isRelayDevice ||
 			!authToken ||
 			!devEui ||
-			permissionLevel > 2 ||
+			!canManage(permissionLevel) ||
 			hasPendingRelayVerification
 		) {
 			return;
diff --git a/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceDashboardHeader.svelte b/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceDashboardHeader.svelte
index 8e744bc2..6f0c9675 100644
--- a/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceDashboardHeader.svelte
+++ b/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceDashboardHeader.svelte
@@ -6,6 +6,7 @@
 	import Icon from '$lib/components/Icon.svelte';
 	import SETTINGS_ICON from '$lib/images/icons/settings.svg';
 	import { m } from '$lib/paraglide/messages.js';
+	import { canManage, isAdmin } from '$lib/constants/permissions';
 	import { CwButton, CwCard, CwDuration, CwSpinner } from '@cropwatchdevelopment/cwui';
 	import CsvExportDialog from './dialogs/csvExportDialog.svelte';
 	import CsvTrafficExportDialog from './dialogs/csvTrafficExportDialog.svelte';
@@ -91,7 +92,7 @@
 		</div>
 
 		<div class="device-header__actions">
-			{#if permissionLevel <= 2}
+			{#if canManage(permissionLevel)}
 				<NotesReviewDialog {authToken} {devEui} disabled={controlsDisabled} />
 
 				<CsvExportDialog
@@ -113,7 +114,7 @@
 				{/if}
 			{/if}
 
-			{#if permissionLevel === 1}
+			{#if isAdmin(permissionLevel)}
 				<CwButton
 					variant="secondary"
 					size="md"
diff --git a/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceOwnerPermissionsCard.svelte b/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceOwnerPermissionsCard.svelte
index 7fb8175d..f46efe89 100644
--- a/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceOwnerPermissionsCard.svelte
+++ b/src/routes/locations/[location_id]/devices/[dev_eui]/DeviceOwnerPermissionsCard.svelte
@@ -1,12 +1,11 @@
 <script lang="ts">
 	import { enhance } from '$app/forms';
-	import { getAppContext } from '$lib/appContext.svelte';
 	import { getPermissionLevelOptions } from '$lib/i18n/options';
 	import { m } from '$lib/paraglide/messages.js';
 	import { CwButton, CwCard, CwDropdown, CwSeparator } from '@cropwatchdevelopment/cwui';
 
 	const EMAIL_PATTERN = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-	const VALID_PERMISSION_LEVELS = new Set([1, 2, 3, 4]);
+	const VALID_PERMISSION_LEVELS = new Set([1, 2, 3, 4, 5]);
 
 	type DeviceOwnerRow = {
 		id: number;
@@ -42,7 +41,6 @@
 
 	let { form, owners }: Props = $props();
 
-	const app = getAppContext();
 	const permissionOptions = getPermissionLevelOptions();
 
 	let ownerSubmittingByKey = $state<Record<string, boolean>>({});
@@ -98,86 +96,84 @@
 			{#each permissionRows as row, index (row.key)}
 				{@const ownerForm = ownerFormFor(row.key)}
 				{#if row.email}
-					{#if !row.email.includes('@cropwatch.io') || app.session?.email.includes('@cropwatch.io')}
-						<div class="permission-row">
-							<form
-								method="POST"
-								action="?/updateDeviceOwnerPermission"
-								class="permission-row__form"
-								use:enhance={({ formData, cancel }) => {
-									if (!isOwnerRowValid(row)) {
-										cancel();
-										return;
+					<div class="permission-row">
+						<form
+							method="POST"
+							action="?/updateDeviceOwnerPermission"
+							class="permission-row__form"
+							use:enhance={({ formData, cancel }) => {
+								if (!isOwnerRowValid(row)) {
+									cancel();
+									return;
+								}
+
+								const key = String(formData.get('ownerKey') ?? row.key);
+								setOwnerSubmitting(key, true);
+
+								return async ({ update }) => {
+									try {
+										await update({ reset: false });
+									} finally {
+										setOwnerSubmitting(key, false);
 									}
-
-									const key = String(formData.get('ownerKey') ?? row.key);
-									setOwnerSubmitting(key, true);
-
-									return async ({ update }) => {
-										try {
-											await update({ reset: false });
-										} finally {
-											setOwnerSubmitting(key, false);
+								};
+							}}
+						>
+							<input type="hidden" name="ownerKey" value={row.key} />
+							<input type="hidden" name="targetUserEmail" value={row.email} />
+							<input type="hidden" name="permissionLevel" value={row.permissionLevel} />
+
+							<div class="permission-user flex items-center justify-center">
+								<p class="text-xl">{row.name} ({row.email})</p>
+							</div>
+
+							<div class="permission-edit">
+								<div class="field-stack">
+									<CwDropdown
+										label={m.locations_permission_level()}
+										options={permissionOptions}
+										bind:value={
+											() => row.permissionLevel,
+											(value) => updateOwnerPermissionLevel(row.key, String(value ?? ''))
 										}
-									};
-								}}
-							>
-								<input type="hidden" name="ownerKey" value={row.key} />
-								<input type="hidden" name="targetUserEmail" value={row.email} />
-								<input type="hidden" name="permissionLevel" value={row.permissionLevel} />
-
-								<div class="permission-user flex items-center justify-center">
-									<p class="text-xl">{row.name} ({row.email})</p>
-								</div>
-
-								<div class="permission-edit">
-									<div class="field-stack">
-										<CwDropdown
-											label={m.locations_permission_level()}
-											options={permissionOptions}
-											bind:value={
-												() => row.permissionLevel,
-												(value) => updateOwnerPermissionLevel(row.key, String(value ?? ''))
-											}
-											error={ownerForm?.fieldErrors?.permissionLevel ||
-												(!isOwnerRowValid(row)
-													? m.devices_choose_valid_permission_level()
-													: undefined)}
-										/>
-										{#if ownerForm?.fieldErrors?.permissionLevel}
-											<p class="field-error">{ownerForm.fieldErrors.permissionLevel}</p>
-										{/if}
-									</div>
-
-									<CwButton
-										type="submit"
-										variant="primary"
-										loading={ownerSubmittingByKey[row.key] ?? false}
-										disabled={(ownerSubmittingByKey[row.key] ?? false) || !isOwnerRowValid(row)}
-									>
-										{m.devices_update_permission()}
-									</CwButton>
+										error={ownerForm?.fieldErrors?.permissionLevel ||
+											(!isOwnerRowValid(row)
+												? m.devices_choose_valid_permission_level()
+												: undefined)}
+									/>
+									{#if ownerForm?.fieldErrors?.permissionLevel}
+										<p class="field-error">{ownerForm.fieldErrors.permissionLevel}</p>
+									{/if}
 								</div>
 
-								{#if ownerForm?.fieldErrors?.targetUserEmail}
-									<p class="field-error permission-feedback">
-										{ownerForm.fieldErrors.targetUserEmail}
-									</p>
-								{/if}
-
-								{#if ownerForm?.message}
-									<p
-										class:feedback-success={ownerForm.success}
-										class="form-feedback permission-feedback"
-									>
-										{ownerForm.message}
-									</p>
-								{/if}
-							</form>
-						</div>
-						{#if index < permissionRows.length - 1}
-							<CwSeparator spacing="0" />
-						{/if}
+								<CwButton
+									type="submit"
+									variant="primary"
+									loading={ownerSubmittingByKey[row.key] ?? false}
+									disabled={(ownerSubmittingByKey[row.key] ?? false) || !isOwnerRowValid(row)}
+								>
+									{m.devices_update_permission()}
+								</CwButton>
+							</div>
+
+							{#if ownerForm?.fieldErrors?.targetUserEmail}
+								<p class="field-error permission-feedback">
+									{ownerForm.fieldErrors.targetUserEmail}
+								</p>
+							{/if}
+
+							{#if ownerForm?.message}
+								<p
+									class:feedback-success={ownerForm.success}
+									class="form-feedback permission-feedback"
+								>
+									{ownerForm.message}
+								</p>
+							{/if}
+						</form>
+					</div>
+					{#if index < permissionRows.length - 1}
+						<CwSeparator spacing="0" />
 					{/if}
 				{/if}
 			{/each}
diff --git a/src/routes/locations/[location_id]/devices/[dev_eui]/settings/device-settings.server.ts b/src/routes/locations/[location_id]/devices/[dev_eui]/settings/device-settings.server.ts
index 4810097a..881aeff8 100644
--- a/src/routes/locations/[location_id]/devices/[dev_eui]/settings/device-settings.server.ts
+++ b/src/routes/locations/[location_id]/devices/[dev_eui]/settings/device-settings.server.ts
@@ -6,11 +6,11 @@ import {
 	TTI_DEVICE_ID_MAX_LENGTH
 } from '$lib/devices/tti-device-id';
 import { m } from '$lib/paraglide/messages.js';
+import { isValidPermissionLevel, PermissionLevel } from '$lib/constants/permissions';
 
 export const DEVICE_NAME_MAX_LENGTH = 120;
 export const DEVICE_GROUP_MAX_LENGTH = 120;
 const EMAIL_PATTERN = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-const VALID_PERMISSION_LEVELS = new Set([1, 2, 3, 4]);
 
 export type DeviceFormValues = {
 	name: string;
@@ -110,7 +110,10 @@ export function normalizeDeviceOwners(
 			const rawId = owner.id;
 			const id = typeof rawId === 'number' && Number.isFinite(rawId) ? rawId : index + 1;
 			const rawPerm = owner.permission_level;
-			const permissionLevel = typeof rawPerm === 'number' && Number.isFinite(rawPerm) ? rawPerm : 4;
+			const permissionLevel =
+				typeof rawPerm === 'number' && Number.isFinite(rawPerm)
+					? rawPerm
+					: PermissionLevel.DISABLED;
 
 			return {
 				id,
@@ -227,7 +230,7 @@ export function validateDeviceOwnerPermissionValues(values: DeviceOwnerPermissio
 		fieldErrors.targetUserEmail = m.devices_owner_email_invalid();
 	}
 
-	if (!Number.isFinite(permissionLevel) || !VALID_PERMISSION_LEVELS.has(permissionLevel)) {
+	if (!Number.isFinite(permissionLevel) || !isValidPermissionLevel(permissionLevel)) {
 		fieldErrors.permissionLevel = m.devices_choose_valid_permission_level();
 	}
 
diff --git a/src/routes/locations/[location_id]/settings/+page.server.ts b/src/routes/locations/[location_id]/settings/+page.server.ts
index def6d264..4f2ac642 100644
--- a/src/routes/locations/[location_id]/settings/+page.server.ts
+++ b/src/routes/locations/[location_id]/settings/+page.server.ts
@@ -1,4 +1,5 @@
 import { ApiService, type LocationOwnerDto } from '$lib/api/api.service';
+import { PermissionLevel } from '$lib/constants/permissions';
 import { m } from '$lib/paraglide/messages.js';
 import { fail } from '@sveltejs/kit';
 import type { Actions, PageServerLoad } from './$types';
@@ -37,7 +38,7 @@ export const load: PageServerLoad = async ({ locals, fetch, params }) => {
 		const owner = location?.cw_location_owners?.find(
 			(owner) =>
 				readUnknownString(owner.user_id) === currentUserId &&
-				readUnknownString(owner.permission_level) === '1'
+				readUnknownString(owner.permission_level) === String(PermissionLevel.ADMIN)
 		);
 		if (!owner) {
 			throw fail(403, {
diff --git a/src/routes/locations/[location_id]/settings/LocationEditPermissions.svelte b/src/routes/locations/[location_id]/settings/LocationEditPermissions.svelte
index 7bbca976..d010d683 100644
--- a/src/routes/locations/[location_id]/settings/LocationEditPermissions.svelte
+++ b/src/routes/locations/[location_id]/settings/LocationEditPermissions.svelte
@@ -10,7 +10,6 @@
 		type CwTableQuery
 	} from '@cropwatchdevelopment/cwui';
 	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import { getAppContext } from '$lib/appContext.svelte';
 	import type { LocationOwnerDto } from '$lib/api/api.dtos';
 	import { getPermissionLevelLabel, getPermissionLevelOptions } from '$lib/i18n/options';
 	import { m } from '$lib/paraglide/messages.js';
@@ -23,15 +22,9 @@
 	} from './location-permission-rows';
 
 	let { data }: { data: { locationOwners: LocationOwnerDto[] } } = $props();
-	const app = getAppContext();
-	// Hide CropWatch staff (@cropwatch.io) permission rows from customers so they are
-	// unaware we have access — but keep them visible when a CropWatch user is logged in.
-	const viewerIsCropwatch = $derived(app.session?.email?.includes('@cropwatch.io') ?? false);
-	let permissions = $derived(
-		mapLocationOwnersToPermissionRows(data.locationOwners).filter(
-			(permission) => viewerIsCropwatch || !permission.email.includes('@cropwatch.io')
-		)
-	);
+	// CropWatch staff rows are filtered out server-side (the API omits
+	// @cropwatch.io owners for non-staff requesters), so no client filter here.
+	let permissions = $derived(mapLocationOwnersToPermissionRows(data.locationOwners));
 	let openDeletePermissionDialog = $state(false);
 	let selectedRow = $state<Permission | null>(null);
 	let location_id = $state(page.params.location_id);
@@ -89,12 +82,12 @@
 			{#if col.key === 'permission_level'}
 				{#if editingPermissionId === row.id}
 					<CwDropdown
-						options={getPermissionLevelOptions(m.permission_level_viewer())}
+						options={getPermissionLevelOptions()}
 						bind:value={row.permission_level}
 						placeholder={m.locations_choose_permission_level()}
 					/>
 				{:else}
-					{getPermissionLevelLabel(row.permission_level, m.permission_level_viewer())}
+					{getPermissionLevelLabel(row.permission_level)}
 				{/if}
 			{:else}
 				{defaultValue}
diff --git a/src/routes/locations/[location_id]/settings/location-settings-actions.server.ts b/src/routes/locations/[location_id]/settings/location-settings-actions.server.ts
index 0efc7e01..9ede35b6 100644
--- a/src/routes/locations/[location_id]/settings/location-settings-actions.server.ts
+++ b/src/routes/locations/[location_id]/settings/location-settings-actions.server.ts
@@ -1,5 +1,6 @@
 import { ApiService, ApiServiceError, type UpdateLocationOwnerRequest } from '$lib/api/api.service';
 import { m } from '$lib/paraglide/messages.js';
+import { PermissionLevel } from '$lib/constants/permissions';
 import { fail } from '@sveltejs/kit';
 import type { Actions } from './$types';
 
@@ -22,7 +23,7 @@ type EditPermissionFormValues = {
 const EMPTY_ADD_VALUES: AddPermissionFormValues = {
 	newUserEmail: '',
 	userId: '',
-	permission_level: 4,
+	permission_level: PermissionLevel.DISABLED,
 	applyToAllDevices: false
 };
 
@@ -149,7 +150,8 @@ export const addPermission: Actions['addPermission'] = async ({
 	const formData = await request.formData();
 	const values: AddPermissionFormValues = {
 		newUserEmail: readString(formData.get('newUserEmail')),
-		permission_level: Number.parseInt(readString(formData.get('permission_level')), 10) || 4,
+		permission_level: Number.parseInt(readString(formData.get('permission_level')), 10) ||
+			PermissionLevel.DISABLED,
 		applyToAllDevices: formData.get('applyToAllDevices') === 'true'
 	};
 
@@ -178,7 +180,7 @@ export const addPermission: Actions['addPermission'] = async ({
 		await apiService.createLocationPermission(
 			locationId,
 			values.newUserEmail,
-			values.permission_level ?? 4,
+			values.permission_level ?? PermissionLevel.DISABLED,
 			values.applyToAllDevices
 		);
 
diff --git a/src/routes/reports-new/+page.svelte b/src/routes/reports-new/+page.svelte
deleted file mode 100644
index d13f34de..00000000
--- a/src/routes/reports-new/+page.svelte
+++ /dev/null
@@ -1,237 +0,0 @@
-<script lang="ts">
-	import { goto } from '$app/navigation';
-	import { page } from '$app/state';
-	import { backHref } from '$lib/navigation/backTo';
-	import { resolve } from '$app/paths';
-	import { readApiErrorMessage } from '$lib/api/api-error';
-	import { ApiService } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import Icon from '$lib/components/Icon.svelte';
-	import { AppPage } from '$lib/components/layout';
-	import type { ReportTemplateDto } from '$lib/api/api.dtos';
-	import {
-		CwButton,
-		CwCard,
-		CwChip,
-		CwDataTable,
-		type CwColumnDef,
-		type CwTableQuery,
-		type CwTableResult
-	} from '@cropwatchdevelopment/cwui';
-	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import { m } from '$lib/paraglide/messages.js';
-	import ADD_ICON from '$lib/images/icons/add.svg';
-	import EDIT_ICON from '$lib/images/icons/edit.svg';
-	import DeleteReportTemplateDialog from './DeleteReportTemplateDialog.svelte';
-	import ViewReportHistoryDialog from './ViewReportHistoryDialog.svelte';
-
-	type ReportTemplateRow = ReportTemplateDto & {
-		statusLabel: string;
-		locationName: string;
-		assignmentSummary: string;
-		recipientSummary: string;
-		cadenceSummary: string;
-		createdAtLabel: string;
-	};
-
-	const columns: CwColumnDef<ReportTemplateRow>[] = [
-		{ key: 'name', header: m.common_name(), sortable: true },
-		{ key: 'statusLabel', header: m.reports_new_status(), sortable: true },
-		{ key: 'assignmentSummary', header: m.reports_new_assigned_devices() },
-		{ key: 'locationName', header: m.nav_locations(), sortable: true },
-		{ key: 'recipientSummary', header: m.reports_new_recipients() },
-		{ key: 'cadenceSummary', header: m.reports_new_cadence() },
-		{ key: 'createdAtLabel', header: m.common_created(), sortable: true }
-	];
-
-	let loading = $state(true);
-	let deletedTemplateIds = $state<number[]>([]);
-	let tableKey = $derived(deletedTemplateIds.join(','));
-	let app = getAppContext();
-
-	async function loadData(query: CwTableQuery): Promise<CwTableResult<ReportTemplateRow>> {
-		try {
-			const api = new ApiService({ authToken: app.accessToken });
-			const templates = await api.getReportTemplates(
-				{ search: query.search?.trim() || undefined },
-				{ signal: query.signal }
-			);
-			const deletedIds = new Set(deletedTemplateIds);
-			let rows = templates.filter((template) => !deletedIds.has(template.id)).map(toRow);
-
-			if (query.sort) {
-				rows = sortRows(rows, query.sort.column, query.sort.direction);
-			}
-
-			const total = rows.length;
-			const skip = (query.page - 1) * query.pageSize;
-			rows = rows.slice(skip, skip + query.pageSize);
-
-			return { rows, total };
-		} catch (error) {
-			throw new Error(readApiErrorMessage(error, m.reports_new_load_failed()));
-		} finally {
-			loading = false;
-		}
-	}
-
-	function handleDeleted(templateId: number) {
-		if (deletedTemplateIds.includes(templateId)) return;
-		deletedTemplateIds = [...deletedTemplateIds, templateId];
-	}
-
-	function toRow(template: ReportTemplateDto): ReportTemplateRow {
-		return {
-			...template,
-			statusLabel: template.isActive ? m.reports_new_active() : m.reports_new_inactive(),
-			locationName: summarizeLocations(template),
-			assignmentSummary: summarizeAssignments(template),
-			recipientSummary: summarizeRecipients(template),
-			cadenceSummary: summarizeCadence(template),
-			createdAtLabel: template.createdAt
-				? new Date(template.createdAt).toLocaleString()
-				: m.common_not_available()
-		};
-	}
-
-	function summarizeLocations(template: ReportTemplateDto): string {
-		const names = template.assignments
-			.map((assignment) => assignment.locationName)
-			.filter((name): name is string => !!name && name.trim().length > 0);
-		const unique = [...new Set(names)];
-		if (unique.length === 0) return m.reports_unknown_location();
-		return unique.length === 1 ? unique[0] : unique.join(', ');
-	}
-
-	function summarizeAssignments(template: ReportTemplateDto): string {
-		if (template.assignments.length === 0) return m.reports_new_no_assignments();
-
-		const labels = template.assignments.map((assignment) =>
-			assignment.deviceName ? `${assignment.deviceName} (${assignment.devEui})` : assignment.devEui
-		);
-
-		return summarizeList(labels);
-	}
-
-	function summarizeRecipients(template: ReportTemplateDto): string {
-		if (template.recipients.length === 0) return m.common_not_available();
-
-		return summarizeList(
-			template.recipients.map(
-				(recipient) => recipient.email ?? recipient.name ?? String(recipient.communicationMethod)
-			)
-		);
-	}
-
-	function summarizeCadence(template: ReportTemplateDto): string {
-		const flags: string[] = [];
-		for (const schedule of template.schedule) {
-			if (!schedule.isActive) continue;
-			if (schedule.endOfDay) flags.push(m.reports_new_cadence_daily());
-			if (schedule.endOfWeek) flags.push(m.reports_new_cadence_weekly());
-			if (schedule.endOfMonth) flags.push(m.reports_new_cadence_monthly());
-		}
-		const unique = [...new Set(flags)];
-		return unique.length > 0 ? unique.join(', ') : m.common_not_available();
-	}
-
-	function summarizeList(items: string[]): string {
-		const visible = items.slice(0, 2).join(', ');
-		const remaining = items.length - 2;
-		return remaining > 0
-			? m.reports_new_summary_more({ summary: visible, count: String(remaining) })
-			: visible;
-	}
-
-	function sortRows(
-		rows: ReportTemplateRow[],
-		column: string,
-		direction: 'asc' | 'desc'
-	): ReportTemplateRow[] {
-		const dir = direction === 'asc' ? 1 : -1;
-
-		return [...rows].sort((a, b) => {
-			const left = (a as unknown as Record<string, unknown>)[column];
-			const right = (b as unknown as Record<string, unknown>)[column];
-
-			if (typeof left === 'number' && typeof right === 'number') {
-				return (left - right) * dir;
-			}
-
-			return String(left ?? '').localeCompare(String(right ?? '')) * dir;
-		});
-	}
-</script>
-
-<svelte:head>
-	<title>{m.reports_new_page_title()}</title>
-</svelte:head>
-
-<AppPage>
-	<CwButton variant="secondary" onclick={() => goto(backHref(page.url, resolve('/')))}>
-		&larr; {m.action_back_to_dashboard()}
-	</CwButton>
-
-	<CwCard title={m.reports_new_configured_templates()}>
-		{#key tableKey}
-			<CwDataTable
-				labels={cwDataTableLabels()}
-				{columns}
-				{loadData}
-				{loading}
-				groupBy="locationName"
-				rowActionsHeader={m.common_actions()}
-				rowKey="id"
-			>
-				{#snippet cell(
-					row: ReportTemplateRow,
-					col: CwColumnDef<ReportTemplateRow>,
-					defaultValue: string
-				)}
-					{#if col.key === 'statusLabel'}
-						<CwChip
-							label={row.statusLabel}
-							tone={row.isActive ? 'success' : 'warning'}
-							variant="soft"
-							size="sm"
-						/>
-					{:else}
-						{defaultValue}
-					{/if}
-				{/snippet}
-
-				{#snippet rowActions(row: ReportTemplateRow)}
-					<div class="reports-new-page__actions">
-						<CwButton
-							variant="secondary"
-							size="md"
-							onclick={() => goto(resolve('/reports-new/edit/[id]', { id: String(row.id) }))}
-						>
-							<Icon src={EDIT_ICON} alt={m.action_edit()} />
-						</CwButton>
-						<ViewReportHistoryDialog templateId={row.id} reportName={row.name} />
-						<DeleteReportTemplateDialog
-							templateId={row.id}
-							reportName={row.name}
-							onDeleted={handleDeleted}
-						/>
-					</div>
-				{/snippet}
-
-				{#snippet toolbarActions()}
-					<CwButton variant="primary" onclick={() => goto(resolve('/reports-new/create'))}>
-						<Icon src={ADD_ICON} alt={m.reports_new_create_template()} />
-					</CwButton>
-				{/snippet}
-			</CwDataTable>
-		{/key}
-	</CwCard>
-</AppPage>
-
-<style>
-	.reports-new-page__actions {
-		display: flex;
-		justify-content: flex-end;
-		gap: var(--cw-space-2);
-	}
-</style>
diff --git a/src/routes/reports-new/[...path]/+page.server.ts b/src/routes/reports-new/[...path]/+page.server.ts
new file mode 100644
index 00000000..afcacad5
--- /dev/null
+++ b/src/routes/reports-new/[...path]/+page.server.ts
@@ -0,0 +1,8 @@
+import { redirect } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types';
+
+// The template-based reports pages took over /reports; keep old bookmarks working.
+export const load: PageServerLoad = ({ params }) => {
+	const suffix = params.path ? `/${params.path}` : '';
+	redirect(301, `/reports${suffix}`);
+};
diff --git a/src/routes/reports/+page.server.ts b/src/routes/reports/+page.server.ts
deleted file mode 100644
index 6b7ae945..00000000
--- a/src/routes/reports/+page.server.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import type { PageServerLoad } from './$types';
-
-// The reports list page uses CwDataTable with a client-side loadData callback that
-// fetches, transforms, and paginates reports on demand. Pre-fetching here would
-// duplicate that work and be thrown away immediately. The root layout supplies
-// `authToken` and `session` to every route via layout data inheritance.
-export const load: PageServerLoad = async () => {
-	return {};
-};
diff --git a/src/routes/reports/+page.svelte b/src/routes/reports/+page.svelte
index ff86355f..ef724d8b 100644
--- a/src/routes/reports/+page.svelte
+++ b/src/routes/reports/+page.svelte
@@ -3,11 +3,16 @@
 	import { page } from '$app/state';
 	import { backHref } from '$lib/navigation/backTo';
 	import { resolve } from '$app/paths';
+	import { readApiErrorMessage } from '$lib/api/api-error';
+	import { ApiService } from '$lib/api/api.service';
+	import { getAppContext } from '$lib/appContext.svelte';
 	import Icon from '$lib/components/Icon.svelte';
 	import { AppPage } from '$lib/components/layout';
+	import type { ReportTemplateDto } from '$lib/api/api.dtos';
 	import {
 		CwButton,
 		CwCard,
+		CwChip,
 		CwDataTable,
 		type CwColumnDef,
 		type CwTableQuery,
@@ -15,89 +20,151 @@
 	} from '@cropwatchdevelopment/cwui';
 	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
 	import { m } from '$lib/paraglide/messages.js';
-	import ReportHistoryDialog from './ReportHistoryDialog.svelte';
-	import DeleteReportDialog from './DeleteReportDialog.svelte';
-	import type { ReportDeviceRelations, ReportRow } from './report-row';
 	import ADD_ICON from '$lib/images/icons/add.svg';
 	import EDIT_ICON from '$lib/images/icons/edit.svg';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import { ApiService } from '$lib/api/api.service';
-	import { formatDateTime } from '$lib/i18n/format';
-
-	type ReportApiRow = ReportDeviceRelations & { created_at: string };
+	import DeleteReportTemplateDialog from './DeleteReportTemplateDialog.svelte';
+	import ViewReportHistoryDialog from './ViewReportHistoryDialog.svelte';
+
+	type ReportTemplateRow = ReportTemplateDto & {
+		statusLabel: string;
+		locationName: string;
+		assignmentSummary: string;
+		recipientSummary: string;
+		cadenceSummary: string;
+		createdAtLabel: string;
+	};
+
+	const columns: CwColumnDef<ReportTemplateRow>[] = [
+		{ key: 'name', header: m.common_name(), sortable: true },
+		{ key: 'statusLabel', header: m.reports_new_status(), sortable: true },
+		{ key: 'assignmentSummary', header: m.reports_new_assigned_devices() },
+		{ key: 'locationName', header: m.nav_locations(), sortable: true },
+		{ key: 'recipientSummary', header: m.reports_new_recipients() },
+		{ key: 'cadenceSummary', header: m.reports_new_cadence() },
+		{ key: 'createdAtLabel', header: m.common_created(), sortable: true }
+	];
 
 	let loading = $state(true);
-	let deletedReportIds = $state<string[]>([]);
+	let deletedTemplateIds = $state<number[]>([]);
+	let tableKey = $derived(deletedTemplateIds.join(','));
 	let app = getAppContext();
 
-	const columns: CwColumnDef<ReportRow>[] = [
-		{ key: 'name', header: m.common_name(), sortable: true },
-		{ key: 'device_name', header: m.reports_for_device(), sortable: true },
-		{ key: 'dev_eui', header: m.devices_dev_eui_label() },
-		{ key: 'location_name', header: m.nav_locations(), sortable: true }
-	];
+	async function loadData(query: CwTableQuery): Promise<CwTableResult<ReportTemplateRow>> {
+		try {
+			const api = new ApiService({ authToken: app.accessToken });
+			const templates = await api.getReportTemplates(
+				{ search: query.search?.trim() || undefined },
+				{ signal: query.signal }
+			);
+			const deletedIds = new Set(deletedTemplateIds);
+			let rows = templates.filter((template) => !deletedIds.has(template.id)).map(toRow);
+
+			if (query.sort) {
+				rows = sortRows(rows, query.sort.column, query.sort.direction);
+			}
+
+			const total = rows.length;
+			const skip = (query.page - 1) * query.pageSize;
+			rows = rows.slice(skip, skip + query.pageSize);
+
+			return { rows, total };
+		} catch (error) {
+			throw new Error(readApiErrorMessage(error, m.reports_new_load_failed()));
+		} finally {
+			loading = false;
+		}
+	}
 
-	const tableKey = $derived(deletedReportIds.join(','));
+	function handleDeleted(templateId: number) {
+		if (deletedTemplateIds.includes(templateId)) return;
+		deletedTemplateIds = [...deletedTemplateIds, templateId];
+	}
 
-	function handleReportDeleted(reportId: string) {
-		if (deletedReportIds.includes(reportId)) return;
-		deletedReportIds = [...deletedReportIds, reportId];
+	function toRow(template: ReportTemplateDto): ReportTemplateRow {
+		return {
+			...template,
+			statusLabel: template.isActive ? m.reports_new_active() : m.reports_new_inactive(),
+			locationName: summarizeLocations(template),
+			assignmentSummary: summarizeAssignments(template),
+			recipientSummary: summarizeRecipients(template),
+			cadenceSummary: summarizeCadence(template),
+			createdAtLabel: template.createdAt
+				? new Date(template.createdAt).toLocaleString()
+				: m.common_not_available()
+		};
 	}
 
-	function sortReports(rows: ReportRow[], column: string, direction: 'asc' | 'desc'): ReportRow[] {
-		const dir = direction === 'asc' ? 1 : -1;
-		return [...rows].sort((a, b) => {
-			const aVal = (a as unknown as Record<string, unknown>)[column];
-			const bVal = (b as unknown as Record<string, unknown>)[column];
-			if (aVal == null && bVal == null) return 0;
-			if (aVal == null) return dir;
-			if (bVal == null) return -dir;
-			return String(aVal).localeCompare(String(bVal)) * dir;
-		});
+	function summarizeLocations(template: ReportTemplateDto): string {
+		const names = template.assignments
+			.map((assignment) => assignment.locationName)
+			.filter((name): name is string => !!name && name.trim().length > 0);
+		const unique = [...new Set(names)];
+		if (unique.length === 0) return m.reports_unknown_location();
+		return unique.length === 1 ? unique[0] : unique.join(', ');
 	}
 
-	async function loadData(query: CwTableQuery): Promise<CwTableResult<ReportRow>> {
-		const search = query.search?.trim() || '';
-		const api = new ApiService({ authToken: app.accessToken });
-		const reports = await api.getReports({ name: search || undefined });
-
-		const deletedIds = new Set(deletedReportIds);
-		let rows: ReportRow[] = reports
-			.map((report) => {
-				const r = report as typeof report & ReportApiRow;
-				const deviceOwners = r.cw_devices?.cw_device_owners ?? [];
-				return {
-					...r,
-					permission_level:
-						deviceOwners.find(
-							(o) =>
-								o.user_id === app.session?.sub &&
-								o.permission_level != null &&
-								o.permission_level <= 3
-						)?.permission_level ?? null,
-					created_at: formatDateTime(r.created_at),
-					location_name:
-						r.cw_devices?.cw_locations?.name ?? m.reports_unknown_location(),
-					device_name: r.cw_devices?.name ?? m.reports_unknown_device()
-				};
-			})
-			.filter((r) => !deletedIds.has(r.report_id));
-
-		if (query.sort) {
-			rows = sortReports(rows, query.sort.column, query.sort.direction);
+	function summarizeAssignments(template: ReportTemplateDto): string {
+		if (template.assignments.length === 0) return m.reports_new_no_assignments();
+
+		const labels = template.assignments.map((assignment) =>
+			assignment.deviceName ? `${assignment.deviceName} (${assignment.devEui})` : assignment.devEui
+		);
+
+		return summarizeList(labels);
+	}
+
+	function summarizeRecipients(template: ReportTemplateDto): string {
+		if (template.recipients.length === 0) return m.common_not_available();
+
+		return summarizeList(
+			template.recipients.map(
+				(recipient) => recipient.email ?? recipient.name ?? String(recipient.communicationMethod)
+			)
+		);
+	}
+
+	function summarizeCadence(template: ReportTemplateDto): string {
+		const flags: string[] = [];
+		for (const schedule of template.schedule) {
+			if (!schedule.isActive) continue;
+			if (schedule.endOfDay) flags.push(m.reports_new_cadence_daily());
+			if (schedule.endOfWeek) flags.push(m.reports_new_cadence_weekly());
+			if (schedule.endOfMonth) flags.push(m.reports_new_cadence_monthly());
 		}
+		const unique = [...new Set(flags)];
+		return unique.length > 0 ? unique.join(', ') : m.common_not_available();
+	}
 
-		const total = rows.length;
-		const skip = (query.page - 1) * query.pageSize;
-		rows = rows.slice(skip, skip + query.pageSize);
+	function summarizeList(items: string[]): string {
+		const visible = items.slice(0, 2).join(', ');
+		const remaining = items.length - 2;
+		return remaining > 0
+			? m.reports_new_summary_more({ summary: visible, count: String(remaining) })
+			: visible;
+	}
+
+	function sortRows(
+		rows: ReportTemplateRow[],
+		column: string,
+		direction: 'asc' | 'desc'
+	): ReportTemplateRow[] {
+		const dir = direction === 'asc' ? 1 : -1;
 
-		loading = false;
-		return { rows, total };
+		return [...rows].sort((a, b) => {
+			const left = (a as unknown as Record<string, unknown>)[column];
+			const right = (b as unknown as Record<string, unknown>)[column];
+
+			if (typeof left === 'number' && typeof right === 'number') {
+				return (left - right) * dir;
+			}
+
+			return String(left ?? '').localeCompare(String(right ?? '')) * dir;
+		});
 	}
 </script>
 
 <svelte:head>
-	<title>{m.reports_page_title()}</title>
+	<title>{m.reports_new_page_title()}</title>
 </svelte:head>
 
 <AppPage>
@@ -105,69 +172,55 @@
 		&larr; {m.action_back_to_dashboard()}
 	</CwButton>
 
-	<CwCard title={m.reports_weekly_reports()}>
+	<CwCard title={m.reports_new_configured_templates()}>
 		{#key tableKey}
-			<CwDataTable labels={cwDataTableLabels()}
+			<CwDataTable
+				labels={cwDataTableLabels()}
 				{columns}
 				{loadData}
 				{loading}
-				groupBy="location_name"
+				groupBy="locationName"
 				rowActionsHeader={m.common_actions()}
 				rowKey="id"
 			>
-				{#snippet cell(row: ReportRow, col: CwColumnDef<ReportRow>, defaultValue: string)}
-					{#if col.key === 'device_name'}
-						{#if row.cw_devices?.cw_locations?.location_id}
-							<a
-								href={resolve('/locations/[location_id]/devices/[dev_eui]', {
-									location_id: String(row.cw_devices.cw_locations.location_id),
-									dev_eui: row.dev_eui
-								})}
-								class="reports-page__device-link ml-2 text-sm hover:underline"
-							>
-								{row.cw_devices?.name ?? m.reports_unknown_device()}
-							</a>
-						{:else}
-							<span class="ml-2 text-sm">{row.cw_devices?.name ?? m.reports_unknown_device()}</span>
-						{/if}
+				{#snippet cell(
+					row: ReportTemplateRow,
+					col: CwColumnDef<ReportTemplateRow>,
+					defaultValue: string
+				)}
+					{#if col.key === 'statusLabel'}
+						<CwChip
+							label={row.statusLabel}
+							tone={row.isActive ? 'success' : 'warning'}
+							variant="soft"
+							size="sm"
+						/>
 					{:else}
 						{defaultValue}
 					{/if}
 				{/snippet}
 
-				{#snippet rowActions(row: ReportRow)}
-					<div class="flex flex-row gap-2">
-						{#if row.permission_level != null && row.permission_level <= 3}
-							<ReportHistoryDialog report_id={row.report_id} dev_eui={row.dev_eui} />
-						{/if}
-						{#if row.permission_level != null && row.permission_level <= 2}
-							<CwButton
-								variant="secondary"
-								onclick={() => {
-									goto(resolve('/reports/[report_id]/edit', { report_id: row.report_id }));
-								}}
-							>
-								<Icon src={EDIT_ICON} alt="Edit" />
-							</CwButton>
-						{/if}
-						{#if row.user_id === app.session?.sub}
-							<DeleteReportDialog
-								reportId={row.report_id}
-								reportName={row.name}
-								onDeleted={handleReportDeleted}
-							/>
-						{/if}
+				{#snippet rowActions(row: ReportTemplateRow)}
+					<div class="reports-new-page__actions">
+						<CwButton
+							variant="secondary"
+							size="md"
+							onclick={() => goto(resolve('/reports/edit/[id]', { id: String(row.id) }))}
+						>
+							<Icon src={EDIT_ICON} alt={m.action_edit()} />
+						</CwButton>
+						<ViewReportHistoryDialog templateId={row.id} reportName={row.name} />
+						<DeleteReportTemplateDialog
+							templateId={row.id}
+							reportName={row.name}
+							onDeleted={handleDeleted}
+						/>
 					</div>
 				{/snippet}
 
 				{#snippet toolbarActions()}
-					<CwButton
-						variant="secondary"
-						onclick={() => {
-							goto(resolve('/reports/new/edit'));
-						}}
-					>
-						<Icon src={ADD_ICON} alt={m.reports_create_page_title()} />
+					<CwButton variant="primary" onclick={() => goto(resolve('/reports/create'))}>
+						<Icon src={ADD_ICON} alt={m.reports_new_create_template()} />
 					</CwButton>
 				{/snippet}
 			</CwDataTable>
@@ -176,7 +229,9 @@
 </AppPage>
 
 <style>
-	.reports-page__device-link {
-		color: var(--cw-info-500);
+	.reports-new-page__actions {
+		display: flex;
+		justify-content: flex-end;
+		gap: var(--cw-space-2);
 	}
 </style>
diff --git a/src/routes/reports/DeleteReportDialog.svelte b/src/routes/reports/DeleteReportDialog.svelte
deleted file mode 100644
index 65c89aa1..00000000
--- a/src/routes/reports/DeleteReportDialog.svelte
+++ /dev/null
@@ -1,133 +0,0 @@
-<script lang="ts">
-	import { invalidateAll } from '$app/navigation';
-	import { ApiService, ApiServiceError } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import Icon from '$lib/components/Icon.svelte';
-	import { CwButton, CwDialog, useCwToast } from '@cropwatchdevelopment/cwui';
-	import { m } from '$lib/paraglide/messages.js';
-	import TRASH_ICON from '$lib/images/icons/trash.svg';
-
-	type DeleteReportDialogProps = {
-		reportId: string;
-		reportName: string;
-		onDeleted?: (reportId: string) => void | Promise<void>;
-	};
-
-	let { reportId, reportName, onDeleted }: DeleteReportDialogProps = $props();
-
-	let open = $state(false);
-	const app = $state(getAppContext());
-	const toast = useCwToast();
-	let deleting = $state(false);
-
-	function isRecord(value: unknown): value is Record<string, unknown> {
-		return typeof value === 'object' && value !== null && !Array.isArray(value);
-	}
-
-	function readErrorMessage(value: unknown): string | null {
-		if (typeof value === 'string') {
-			const trimmed = value.trim();
-			return trimmed.length > 0 ? trimmed : null;
-		}
-
-		if (Array.isArray(value)) {
-			for (const item of value) {
-				const message = readErrorMessage(item);
-				if (message) return message;
-			}
-			return null;
-		}
-
-		if (!isRecord(value)) {
-			return null;
-		}
-
-		return (
-			readErrorMessage(value.message) ??
-			readErrorMessage(value.error) ??
-			readErrorMessage(value.detail) ??
-			readErrorMessage(value.payload)
-		);
-	}
-
-	function getDeleteErrorMessage(error: unknown): string {
-		const fallback = m.reports_delete_failed();
-
-		if (error instanceof ApiServiceError) {
-			return readErrorMessage(error.payload) ?? fallback;
-		}
-
-		if (error instanceof Error) {
-			const message = error.message.trim();
-			return message.length > 0 ? message : fallback;
-		}
-
-		return fallback;
-	}
-
-	function getDeleteSuccessMessage(name: string): string {
-		const trimmed = name.trim();
-		return trimmed.length > 0
-			? m.reports_deleted_named({ name: trimmed })
-			: m.reports_deleted_successfully();
-	}
-
-	const deleteReport = async (id: string) => {
-		const trimmedId = id.trim();
-		if (deleting) return;
-		if (!trimmedId) {
-			toast.add({
-				tone: 'danger',
-				message: m.reports_delete_missing_id()
-			});
-			return;
-		}
-
-		deleting = true;
-
-		try {
-			const api = new ApiService({
-				authToken: app.accessToken
-			});
-			await api.deleteReport(trimmedId);
-
-			open = false;
-			await onDeleted?.(trimmedId);
-			toast.add({ tone: 'success', message: getDeleteSuccessMessage(reportName) });
-
-			try {
-				await invalidateAll();
-			} catch (refreshError) {
-				console.error('Deleted report but failed to refresh reports page:', {
-					reportId: trimmedId,
-					refreshError
-				});
-			}
-		} catch (error) {
-			const message = getDeleteErrorMessage(error);
-			console.error('Error deleting report:', { reportId: trimmedId, error });
-			toast.add({ tone: 'danger', message });
-		} finally {
-			deleting = false;
-		}
-	};
-</script>
-
-<CwButton size="md" variant="danger" disabled={deleting} onclick={() => (open = true)}>
-	<Icon src={TRASH_ICON} alt={m.action_delete()} />
-</CwButton>
-
-<CwDialog bind:open title={m.reports_confirm_delete_title()}>
-	<p>{m.reports_confirm_delete_body({ name: reportName })}</p>
-	<div class="mt-4 flex justify-end gap-2">
-		<CwButton variant="primary" disabled={deleting} onclick={() => (open = false)}>
-			{m.action_cancel()}
-		</CwButton>
-		<CwButton
-			variant="danger"
-			loading={deleting}
-			disabled={deleting}
-			onclick={() => void deleteReport(reportId)}>{m.action_delete()}</CwButton
-		>
-	</div>
-</CwDialog>
diff --git a/src/routes/reports-new/DeleteReportTemplateDialog.svelte b/src/routes/reports/DeleteReportTemplateDialog.svelte
similarity index 100%
rename from src/routes/reports-new/DeleteReportTemplateDialog.svelte
rename to src/routes/reports/DeleteReportTemplateDialog.svelte
diff --git a/src/routes/reports-new/ReportCadenceSection.svelte b/src/routes/reports/ReportCadenceSection.svelte
similarity index 100%
rename from src/routes/reports-new/ReportCadenceSection.svelte
rename to src/routes/reports/ReportCadenceSection.svelte
diff --git a/src/routes/reports/ReportHistoryDialog.svelte b/src/routes/reports/ReportHistoryDialog.svelte
deleted file mode 100644
index 66ac8ff5..00000000
--- a/src/routes/reports/ReportHistoryDialog.svelte
+++ /dev/null
@@ -1,165 +0,0 @@
-<script lang="ts">
-	import { ApiService, ApiServiceError } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import Icon from '$lib/components/Icon.svelte';
-	import {
-		CwButton,
-		CwCard,
-		CwDataTable,
-		CwDialog,
-		CwTooltip,
-		useCwToast,
-		type CwTableQuery,
-		type CwTableResult
-	} from '@cropwatchdevelopment/cwui';
-	import { formatDateTime } from '$lib/i18n/format';
-	import { m } from '$lib/paraglide/messages.js';
-	import { type PdfFile } from '$lib/interfaces/PdfFile.interface';
-	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import HISTORY_ICON from '$lib/images/icons/history.svg';
-
-	type ReportHistoryRow = { dev_eui: string; report_id: string; name: string; created_at: string };
-
-	let {
-		open = $bindable(),
-		dev_eui,
-		report_id
-	}: { open?: boolean; dev_eui: string; report_id: string } = $props();
-	const app = $state(getAppContext());
-	const toast = useCwToast();
-
-	function isRecord(value: unknown): value is Record<string, unknown> {
-		return typeof value === 'object' && value !== null && !Array.isArray(value);
-	}
-
-	function readErrorMessage(value: unknown): string | null {
-		if (typeof value === 'string') {
-			const trimmed = value.trim();
-			return trimmed.length > 0 ? trimmed : null;
-		}
-
-		if (Array.isArray(value)) {
-			for (const item of value) {
-				const message = readErrorMessage(item);
-				if (message) return message;
-			}
-			return null;
-		}
-
-		if (!isRecord(value)) {
-			return null;
-		}
-
-		return (
-			readErrorMessage(value.message) ??
-			readErrorMessage(value.error) ??
-			readErrorMessage(value.detail) ??
-			readErrorMessage(value.payload)
-		);
-	}
-
-	function getRequestErrorMessage(action: 'load' | 'download', error: unknown): string {
-		const fallback =
-			action === 'load' ? m.reports_history_load_failed() : m.reports_download_failed();
-
-		if (error instanceof ApiServiceError) {
-			return readErrorMessage(error.payload) ?? fallback;
-		}
-
-		if (error instanceof Error) {
-			const message = error.message.trim();
-			return message.length > 0 ? message : fallback;
-		}
-
-		return fallback;
-	}
-
-	function createApiService(): ApiService {
-		return new ApiService({
-			authToken: app.accessToken ?? null
-		});
-	}
-
-	function mapHistoryRows(files: PdfFile[]): ReportHistoryRow[] {
-		return files.map((file) => ({
-			dev_eui,
-			report_id,
-			name: file.name,
-			created_at: formatDateTime(file.created_at)
-		}));
-	}
-
-	async function loadData(_query: CwTableQuery): Promise<CwTableResult<ReportHistoryRow>> {
-		void _query;
-
-		try {
-			const rows = mapHistoryRows(await createApiService().getReportHistory(dev_eui));
-			return { rows, total: rows.length };
-		} catch (error) {
-			const message = getRequestErrorMessage('load', error);
-			console.error('Failed to load report history', { dev_eui, error });
-			toast.add({ tone: 'danger', message });
-			throw new Error(message);
-		}
-	}
-
-	async function handleDownload(dev_eui: string, report_id: string, name: string) {
-		try {
-			const response = await createApiService().getReportDownloadUrl(dev_eui, report_id, name);
-			const signedUrl = typeof response.url === 'string' ? response.url : null;
-			if (!signedUrl) {
-				const message = m.reports_download_missing_signed_url();
-				console.error('Download failed: signed URL missing', { dev_eui, report_id, response });
-				toast.add({ tone: 'danger', message });
-				return;
-			}
-
-			window.open(signedUrl, '_blank', 'noopener');
-		} catch (error) {
-			const message = getRequestErrorMessage('download', error);
-			console.error('Error downloading file', { dev_eui, report_id, error });
-			toast.add({ tone: 'danger', message });
-		}
-	}
-</script>
-
-<CwButton variant="info" size="md" onclick={() => (open = true)}>
-	<Icon src={HISTORY_ICON} alt={m.reports_history_title()} />
-</CwButton>
-
-<CwDialog {open} title={m.reports_history_title()} onclose={() => (open = false)} class="w-full">
-	<CwCard title={m.reports_problem_reports()} class="mb-4 p-4">
-		<CwTooltip tone="info" position="left" value={m.reports_problem_reports_tooltip()}>
-			<CwButton variant="primary" disabled>{m.reports_problems_only_report()}</CwButton>
-		</CwTooltip>
-	</CwCard>
-
-	{#if open}
-		<CwDataTable labels={cwDataTableLabels()}
-			columns={[
-				{ key: 'name', header: 'Name' },
-				{ key: 'created_at', header: m.reports_created_at() }
-				// { key: 'dev_eui', header: 'Dev EUI' },
-			]}
-			rowActionsHeader={m.common_actions()}
-			{loadData}
-			rowKey="name"
-		>
-			{#snippet rowActions(row: ReportHistoryRow)}
-				<CwButton
-					size="sm"
-					variant="secondary"
-					onclick={() => {
-						handleDownload(dev_eui, report_id, row.name);
-					}}
-				>
-					{m.action_download()}
-				</CwButton>
-			{/snippet}
-		</CwDataTable>
-	{/if}
-
-	{#snippet actions()}
-		<CwButton variant="secondary" onclick={() => (open = false)}>{m.action_close()}</CwButton>
-	{/snippet}
-</CwDialog>
diff --git a/src/routes/reports-new/ReportProcessingSchedulesSection.svelte b/src/routes/reports/ReportProcessingSchedulesSection.svelte
similarity index 100%
rename from src/routes/reports-new/ReportProcessingSchedulesSection.svelte
rename to src/routes/reports/ReportProcessingSchedulesSection.svelte
diff --git a/src/routes/reports-new/ReportRecipientsSection.svelte b/src/routes/reports/ReportRecipientsSection.svelte
similarity index 100%
rename from src/routes/reports-new/ReportRecipientsSection.svelte
rename to src/routes/reports/ReportRecipientsSection.svelte
diff --git a/src/routes/reports-new/ReportTemplateForm.svelte b/src/routes/reports/ReportTemplateForm.svelte
similarity index 98%
rename from src/routes/reports-new/ReportTemplateForm.svelte
rename to src/routes/reports/ReportTemplateForm.svelte
index c51100de..c5342991 100644
--- a/src/routes/reports-new/ReportTemplateForm.svelte
+++ b/src/routes/reports/ReportTemplateForm.svelte
@@ -156,8 +156,7 @@
 		if (usable.length === 0) {
 			return [
 				{ label: m.reports_create_method_email(), value: '1' },
-				{ label: m.reports_create_method_sms(), value: '2' },
-				{ label: m.reports_create_method_discord(), value: '3' }
+				{ label: m.reports_create_method_sms(), value: '2' }
 			];
 		}
 		return usable.map((method) => ({
@@ -250,7 +249,7 @@
 				});
 			}
 
-			await goto(resolve('/reports-new'));
+			await goto(resolve('/reports'));
 		} catch (error) {
 			toast.add({
 				tone: 'danger',
@@ -361,7 +360,7 @@
 	<AppFormStack padded>
 		<CwSeparator />
 		<AppActionRow>
-			<CwButton variant="ghost" onclick={() => goto(resolve('/reports-new'))} disabled={submitting}>
+			<CwButton variant="ghost" onclick={() => goto(resolve('/reports'))} disabled={submitting}>
 				{m.action_cancel()}
 			</CwButton>
 			<CwButton
diff --git a/src/routes/reports-new/ViewReportHistoryDialog.svelte b/src/routes/reports/ViewReportHistoryDialog.svelte
similarity index 100%
rename from src/routes/reports-new/ViewReportHistoryDialog.svelte
rename to src/routes/reports/ViewReportHistoryDialog.svelte
diff --git a/src/routes/reports/[report_id]/edit/+page.server.ts b/src/routes/reports/[report_id]/edit/+page.server.ts
deleted file mode 100644
index d6a4a93e..00000000
--- a/src/routes/reports/[report_id]/edit/+page.server.ts
+++ /dev/null
@@ -1,144 +0,0 @@
-import { ApiService } from '$lib/api/api.service';
-import { m } from '$lib/paraglide/messages.js';
-import { error, fail, type Actions } from '@sveltejs/kit';
-import type { PageServerLoad } from './$types';
-import {
-	REPORT_CREATED_SUCCESS_MESSAGE,
-	REPORT_UPDATED_SUCCESS_MESSAGE,
-	REPORT_UPDATE_FAILED_MESSAGE,
-	parsePayload,
-	readApiMessage,
-	readApiStatus,
-	readCurrentUser,
-	readReportId,
-	readString,
-	sanitizeReportPayload
-} from './report-action.server';
-
-export const load: PageServerLoad = async ({ locals, fetch, params, url }) => {
-	const authToken = locals.jwtString ?? null;
-	const reportId = readString(params.report_id);
-	const isCreate = reportId === 'new';
-	const currentUser = readCurrentUser(locals);
-
-	if (!authToken) {
-		error(401, m.error_unauthorized_title());
-	}
-
-	const api = new ApiService({ fetchFn: fetch, authToken });
-
-	if (isCreate) {
-		const devEui = url.searchParams.get('dev_eui')?.trim() || null;
-		const devices = await api.getAllDevices().catch(() => []);
-		return { authToken, currentUser, devices, devEui, report: null };
-	}
-
-	if (!reportId) {
-		error(404, m.error_not_found_title());
-	}
-
-	try {
-		const [report, devices] = await Promise.all([
-			api.getReport(reportId),
-			api.getAllDevices().catch(() => [])
-		]);
-
-		return {
-			authToken,
-			currentUser,
-			devices,
-			devEui: null,
-			report
-		};
-	} catch (sourceError) {
-		const status = readApiStatus(sourceError);
-		const fallback = status === 404 ? m.error_not_found_title() : REPORT_UPDATE_FAILED_MESSAGE;
-		error(status, readApiMessage(sourceError, fallback));
-	}
-};
-
-export const actions: Actions = {
-	default: async ({ request, locals, fetch, params }) => {
-		const authToken = locals.jwtString ?? null;
-		const reportId = readString(params.report_id);
-		const isCreate = reportId === 'new';
-		const currentUser = readCurrentUser(locals);
-
-		if (!authToken) {
-			return fail(401, { error: m.auth_not_authenticated() });
-		}
-
-		if (!isCreate && !reportId) {
-			return fail(404, { error: m.error_not_found_title() });
-		}
-
-		const parsedPayload = parsePayload(await request.formData());
-		if (!parsedPayload) {
-			return fail(400, {
-				error: m.reports_create_payload_unreadable()
-			});
-		}
-
-		const sanitizedPayload = sanitizeReportPayload(parsedPayload.value, {
-			report_id: isCreate ? undefined : reportId,
-			user_id: currentUser?.id
-		});
-
-		if (!sanitizedPayload.name) {
-			return fail(400, {
-				error: m.validation_name_required(),
-				payload: parsedPayload.raw
-			});
-		}
-
-		if (!sanitizedPayload.dev_eui) {
-			return fail(400, {
-				error: m.devices_dev_eui_required(),
-				payload: parsedPayload.raw
-			});
-		}
-
-		if (sanitizedPayload.dev_eui.length !== 16) {
-			return fail(400, {
-				error: m.devices_dev_eui_invalid(),
-				payload: parsedPayload.raw
-			});
-		}
-
-		const api = new ApiService({
-			fetchFn: fetch,
-			authToken
-		});
-
-		try {
-			if (isCreate) {
-				const createdReport = await api.createReport(sanitizedPayload);
-
-				return {
-					success: true,
-					message: REPORT_CREATED_SUCCESS_MESSAGE,
-					report_id: readReportId(createdReport) ?? undefined
-				};
-			}
-
-			await api.updateReport(reportId, sanitizedPayload);
-
-			return {
-				success: true,
-				message: REPORT_UPDATED_SUCCESS_MESSAGE,
-				report_id: reportId
-			};
-		} catch (sourceError) {
-			const message = readApiMessage(
-				sourceError,
-				isCreate ? m.reports_create_failed() : REPORT_UPDATE_FAILED_MESSAGE
-			);
-			const status = readApiStatus(sourceError);
-
-			return fail(status, {
-				error: message,
-				payload: parsedPayload.raw
-			});
-		}
-	}
-};
diff --git a/src/routes/reports/[report_id]/edit/+page.svelte b/src/routes/reports/[report_id]/edit/+page.svelte
deleted file mode 100644
index 681566c1..00000000
--- a/src/routes/reports/[report_id]/edit/+page.svelte
+++ /dev/null
@@ -1,400 +0,0 @@
-<script lang="ts">
-	import { applyAction, enhance } from '$app/forms';
-	import { goto } from '$app/navigation';
-	import { resolve } from '$app/paths';
-	import { ApiService } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import Icon from '$lib/components/Icon.svelte';
-	import { AppActionRow, AppFormStack, AppNotice, AppPage } from '$lib/components/layout';
-	import { m } from '$lib/paraglide/messages.js';
-	import { onMount } from 'svelte';
-	import {
-		CwAlertPointsEditor,
-		CwButton,
-		CwCard,
-		CwDropdown,
-		CwInput,
-		useCwToast
-	} from '@cropwatchdevelopment/cwui';
-	import type { CwAlertPointsValue } from '@cropwatchdevelopment/cwui';
-	import type { DeviceDto } from '$lib/api/api.dtos';
-	import type { PageProps } from './$types';
-	import ReportCadenceSection from './ReportCadenceSection.svelte';
-	import ReportProcessingSchedulesSection from './ReportProcessingSchedulesSection.svelte';
-	import ReportRecipientsSection from './ReportRecipientsSection.svelte';
-	import SAVE_ICON from '$lib/images/icons/save.svg';
-	import CANCEL_ICON from '$lib/images/icons/no.svg';
-	import type { ReportDraft, SelectOption } from './report-form.types';
-	import { createReportAlertPointsEditorText } from './alert-points-editor-text';
-	import { buildReportDataPullIntervalOptions } from './data-pull-interval';
-	import {
-		buildRequestPayload,
-		buildValidationIssues,
-		cleanOptional,
-		createEmptyAlertPointsValue,
-		createReportDraftFactory,
-		normalizeDevEui,
-		preventImplicitFormSubmission,
-		type CurrentUser
-	} from './report-form';
-
-	type ReportForm = {
-		error?: string;
-		message?: string;
-		payload?: string;
-		report_id?: string;
-		success?: boolean;
-	} | null;
-
-	type DeviceListEntry = {
-		dev_eui: string;
-		name?: string | null;
-	};
-
-	const REPORT_CREATED_SUCCESS_MESSAGE = 'Report created successfully.';
-	const REPORT_UPDATED_SUCCESS_MESSAGE = 'Report updated successfully.';
-
-	const toast = useCwToast();
-	const app = getAppContext();
-
-	let { data, form }: PageProps = $props();
-	const report = (() => data.report ?? null)();
-	const isEditing = report !== null;
-	const authToken = (() => data.authToken ?? null)();
-	const serverDevices = (() => data.devices ?? [])();
-	const currentUser = (() => (data.currentUser ?? null) as CurrentUser)();
-	const initialDevEui = (() => data.devEui ?? '')();
-	let actionForm = $derived((form ?? null) as ReportForm);
-	let communicationMethodOptions = $derived<SelectOption[]>([
-		{ label: m.reports_create_method_email(), value: '1' },
-		{ label: m.reports_create_method_sms(), value: '2' },
-		{ label: m.reports_create_method_discord(), value: '3' }
-	]);
-	let daysOfTheWeek = $derived<SelectOption[]>([
-		{ label: m.common_day_sunday(), value: '0' },
-		{ label: m.common_day_monday(), value: '1' },
-		{ label: m.common_day_tuesday(), value: '2' },
-		{ label: m.common_day_wednesday(), value: '3' },
-		{ label: m.common_day_thursday(), value: '4' },
-		{ label: m.common_day_friday(), value: '5' },
-		{ label: m.common_day_saturday(), value: '6' }
-	]);
-	let dataProcessingRuleTypeOptions = $derived<SelectOption[]>([
-		{ label: m.reports_schedule_rule_type_include(), value: 'include' },
-		{ label: m.reports_schedule_rule_type_exclude(), value: 'exclude' }
-	]);
-
-	let submitting = $state(false);
-	let submitAttempted = $state(false);
-	let rowSequence = 0;
-
-	function nextRowKey(prefix: string): string {
-		rowSequence += 1;
-		return `${prefix}-${rowSequence}`;
-	}
-
-	const reportDrafts = createReportDraftFactory({
-		currentUser,
-		initialDevEui,
-		nextRowKey,
-		report
-	});
-
-	function addDataProcessingSchedule() {
-		fields.report_data_processing_schedules.push(reportDrafts.createEmptyDataProcessingSchedule());
-	}
-
-	function removeDataProcessingSchedule(key: string) {
-		const idx = fields.report_data_processing_schedules.findIndex((s) => s.key === key);
-		if (idx >= 0) fields.report_data_processing_schedules.splice(idx, 1);
-	}
-
-	function addRecipient() {
-		fields.report_recipients = [
-			...fields.report_recipients,
-			reportDrafts.createEmptyRecipient(fields.user_id)
-		];
-	}
-
-	function removeRecipient(key: string) {
-		fields.report_recipients = fields.report_recipients.filter(
-			(recipient) => recipient.key !== key
-		);
-	}
-
-	let fields = $state<ReportDraft>(
-		report ? reportDrafts.buildDraftFromReport(report) : reportDrafts.buildDefaultDraft()
-	);
-	let alertPointsValue = $state<CwAlertPointsValue>(
-		report ? reportDrafts.buildAlertPointsValueFromReport(report) : createEmptyAlertPointsValue()
-	);
-	let fallbackDevices = $state<DeviceDto[]>([]);
-	let loadingDevices = $state(false);
-	let selectedDevEui = $state(
-		report ? normalizeDevEui(report.dev_eui ?? '') : normalizeDevEui(initialDevEui)
-	);
-
-	async function loadDevicesFromApi() {
-		if (!authToken || loadingDevices) return;
-
-		loadingDevices = true;
-
-		try {
-			const api = new ApiService({ authToken });
-			const devices = await api.getAllDevices();
-
-			if (devices.length > 0) {
-				fallbackDevices = devices;
-			}
-		} catch (sourceError) {
-			console.error('Failed to load devices:', sourceError);
-		} finally {
-			loadingDevices = false;
-		}
-	}
-
-	onMount(() => {
-		if (!selectedDevEui) {
-			selectedDevEui = normalizeDevEui(fields.dev_eui);
-		}
-
-		if (app.devices.length === 0 && serverDevices.length === 0 && authToken) {
-			void loadDevicesFromApi();
-		}
-	});
-
-	let availableDevices = $derived.by<DeviceListEntry[]>(() => {
-		const baseDevices =
-			app.devices.length > 0
-				? app.devices
-				: fallbackDevices.length > 0
-					? fallbackDevices
-					: serverDevices;
-		const normalizedCurrentDevEui = normalizeDevEui(report?.dev_eui ?? fields.dev_eui);
-		const merged: DeviceListEntry[] = (baseDevices ?? []).map((device) => ({
-			dev_eui: device.dev_eui,
-			name: device.name
-		}));
-
-		if (
-			normalizedCurrentDevEui &&
-			!merged.some((device) => normalizeDevEui(device.dev_eui) === normalizedCurrentDevEui)
-		) {
-			merged.unshift({
-				dev_eui: normalizedCurrentDevEui
-			});
-		}
-
-		return merged;
-	});
-	let normalizedSelectedDevEui = $derived(normalizeDevEui(selectedDevEui));
-	let deviceOptions = $derived.by<SelectOption[]>(() => {
-		const optionsByValue: Record<string, SelectOption> = {};
-
-		for (const device of availableDevices) {
-			const devEui = normalizeDevEui(device.dev_eui);
-			if (!devEui || optionsByValue[devEui]) continue;
-
-			optionsByValue[devEui] = {
-				label: device.name ? `${device.name} (${devEui})` : devEui,
-				value: devEui
-			};
-		}
-
-		return Object.values(optionsByValue).sort((left, right) =>
-			left.label.localeCompare(right.label)
-		);
-	});
-	let dataPullIntervalOptions = $derived.by<SelectOption[]>(() => [
-		...buildReportDataPullIntervalOptions(fields.data_pull_interval)
-	]);
-	let requestPayload = $derived.by(() =>
-		buildRequestPayload(fields, normalizedSelectedDevEui, alertPointsValue, currentUser)
-	);
-	let requestPayloadCompact = $derived.by(() => JSON.stringify(requestPayload));
-	let validationIssues = $derived.by(() =>
-		buildValidationIssues(fields, normalizedSelectedDevEui, alertPointsValue, currentUser)
-	);
-	let alertPointsEditorText = $derived.by(() => createReportAlertPointsEditorText());
-	let canSubmit = $derived(validationIssues.length === 0);
-</script>
-
-<svelte:head>
-	<title
-		>{isEditing ? m.reports_edit_page_title() : m.reports_create_page_title()} | CropWatch</title
-	>
-</svelte:head>
-
-<AppPage width="xl" class="report-page">
-	<div class="report-page__shell">
-		<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/reports'))}>
-			&larr; {m.action_back()}
-		</CwButton>
-
-		<form
-			method="POST"
-			class="flex flex-col gap-4"
-			{@attach preventImplicitFormSubmission}
-			use:enhance={({ cancel }) => {
-				submitAttempted = true;
-
-				if (!canSubmit) {
-					cancel();
-					toast.add({
-						tone: 'danger',
-						message: validationIssues[0] ?? m.reports_create_invalid_toast()
-					});
-					return;
-				}
-
-				submitting = true;
-
-				return async ({ result }) => {
-					submitting = false;
-
-					if (result.type === 'success') {
-						toast.add({
-							tone: 'success',
-							message:
-								typeof result.data?.message === 'string'
-									? result.data.message
-									: isEditing
-										? REPORT_UPDATED_SUCCESS_MESSAGE
-										: REPORT_CREATED_SUCCESS_MESSAGE
-						});
-						await goto(resolve('/reports'), { invalidateAll: true });
-						return;
-					}
-
-					await applyAction(result);
-
-					if (result.type === 'failure' && typeof result.data?.error === 'string') {
-						toast.add({ tone: 'danger', message: result.data.error });
-						return;
-					}
-
-					if (result.type === 'error') {
-						toast.add({
-							tone: 'danger',
-							message: isEditing ? REPORT_UPDATED_SUCCESS_MESSAGE : REPORT_CREATED_SUCCESS_MESSAGE
-						});
-					}
-				};
-			}}
-		>
-			<input type="hidden" name="payload" value={requestPayloadCompact} />
-
-			{#if actionForm?.error}
-				<AppNotice tone="danger">
-					<p>{actionForm.error}</p>
-				</AppNotice>
-			{/if}
-
-			{#if submitAttempted && validationIssues.length > 0}
-				<AppNotice tone="warning" title={m.reports_create_validation_title()} ariaLive="polite">
-					<div>
-						<p>{m.reports_create_validation_copy()}</p>
-					</div>
-
-					<ul class="list-disc pl-5">
-						{#each validationIssues as issue (issue)}
-							<li>{issue}</li>
-						{/each}
-					</ul>
-				</AppNotice>
-			{/if}
-
-			<CwCard
-				title={m.reports_create_basics_title()}
-				subtitle={m.reports_create_basics_subtitle()}
-				elevated
-			>
-				<AppFormStack padded>
-					<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
-						<CwInput
-							label={m.common_name()}
-							required
-							placeholder={m.reports_create_name_placeholder()}
-							bind:value={fields.name}
-						/>
-
-						<CwDropdown
-							label={m.devices_device()}
-							placeholder={m.reports_create_device_placeholder()}
-							options={deviceOptions}
-							bind:value={selectedDevEui}
-							disabled={deviceOptions.length === 0 || loadingDevices}
-						/>
-					</div>
-
-					<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
-						<CwDropdown
-							label="Data pull interval"
-							options={dataPullIntervalOptions}
-							bind:value={fields.data_pull_interval}
-						/>
-					</div>
-
-					{#if !loadingDevices && deviceOptions.length === 0}
-						<AppNotice tone="neutral">
-							<p>{m.reports_create_no_devices_loaded()}</p>
-						</AppNotice>
-					{/if}
-				</AppFormStack>
-			</CwCard>
-
-			<ReportCadenceSection bind:schedules={fields.report_user_schedule} />
-
-			<ReportProcessingSchedulesSection
-				bind:schedules={fields.report_data_processing_schedules}
-				{daysOfTheWeek}
-				ruleTypeOptions={dataProcessingRuleTypeOptions}
-				onAdd={addDataProcessingSchedule}
-				onRemove={removeDataProcessingSchedule}
-			/>
-
-			<CwCard title={m.reports_create_alerts_title()} elevated>
-				<AppFormStack padded>
-					<p class="text-[color:var(--cw-text-secondary)]">{m.reports_create_alerts_copy()}</p>
-					<CwAlertPointsEditor bind:value={alertPointsValue} text={alertPointsEditorText} />
-				</AppFormStack>
-			</CwCard>
-
-			<ReportRecipientsSection
-				bind:recipients={fields.report_recipients}
-				{communicationMethodOptions}
-				onAdd={addRecipient}
-				onRemove={removeRecipient}
-			/>
-
-			<CwCard elevated>
-				<AppFormStack padded>
-					<AppActionRow>
-						<CwButton type="button" variant="secondary" onclick={() => goto(resolve('/reports'))}>
-							<Icon src={CANCEL_ICON} class="h-4 w-4" />
-							{m.action_cancel()}
-						</CwButton>
-						<CwButton type="submit" variant="primary" loading={submitting} disabled={!canSubmit}>
-							<Icon src={SAVE_ICON} class="h-4 w-4" />
-							{#if submitting}
-								{m.action_saving()}
-							{:else if isEditing}
-								{m.action_save_changes()}
-							{:else}
-								{m.reports_create_submit()}
-							{/if}
-						</CwButton>
-					</AppActionRow>
-				</AppFormStack>
-			</CwCard>
-		</form>
-	</div>
-</AppPage>
-
-<style>
-	.report-page__shell {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-4);
-	}
-</style>
diff --git a/src/routes/reports/[report_id]/edit/ReportCadenceSection.svelte b/src/routes/reports/[report_id]/edit/ReportCadenceSection.svelte
deleted file mode 100644
index 511ed2d2..00000000
--- a/src/routes/reports/[report_id]/edit/ReportCadenceSection.svelte
+++ /dev/null
@@ -1,84 +0,0 @@
-<script lang="ts">
-	import { AppFormStack, AppNotice } from '$lib/components/layout';
-	import { m } from '$lib/paraglide/messages.js';
-	import { CwCard, CwSwitch } from '@cropwatchdevelopment/cwui';
-	import type { ScheduleDraft } from './report-form.types';
-
-	interface Props {
-		schedules?: ScheduleDraft[];
-	}
-
-	let { schedules = $bindable<ScheduleDraft[]>([]) }: Props = $props();
-</script>
-
-<CwCard
-	title={m.reports_create_schedules_title()} elevated>
-	<AppFormStack padded>
-		{#if schedules.length === 0}
-			<AppNotice tone="neutral">
-				<p>{m.reports_create_empty_schedules()}</p>
-			</AppNotice>
-		{/if}
-
-		{#each schedules as schedule, index (schedule.key)}
-			<div class="report-entry-card">
-				<div class="report-entry-card__header">
-					<div>
-						<h3>{m.reports_create_schedule_heading({ index: String(index + 1) })}</h3>
-						<p>{m.reports_create_schedule_copy()}</p>
-					</div>
-				</div>
-
-				<div class="report-switch-grid">
-					<CwSwitch
-						checked={schedule.end_of_week}
-						label={m.reports_create_schedule_week_label()}
-						description={m.reports_create_schedule_week_description()}
-						onchange={(checked) => (schedule.end_of_week = checked)}
-					/>
-					<CwSwitch
-						checked={schedule.end_of_day}
-						label={m.reports_create_schedule_day_label()}
-						description={m.reports_create_schedule_day_description()}
-						onchange={(checked) => (schedule.end_of_day = checked)}
-					/>
-				</div>
-			</div>
-		{/each}
-	</AppFormStack>
-</CwCard>
-
-<style>
-	.report-entry-card {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-3);
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.report-entry-card__header h3 {
-		margin: 0;
-		font-size: 1rem;
-		font-weight: var(--cw-font-semibold);
-	}
-
-	.report-entry-card__header p {
-		margin: var(--cw-space-1) 0 0;
-		color: var(--cw-text-secondary);
-	}
-
-	.report-switch-grid {
-		display: grid;
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-		gap: var(--cw-space-3);
-	}
-
-	@media (max-width: 639px) {
-		.report-switch-grid {
-			grid-template-columns: 1fr;
-		}
-	}
-</style>
diff --git a/src/routes/reports/[report_id]/edit/ReportProcessingSchedulesSection.svelte b/src/routes/reports/[report_id]/edit/ReportProcessingSchedulesSection.svelte
deleted file mode 100644
index ac7b5b45..00000000
--- a/src/routes/reports/[report_id]/edit/ReportProcessingSchedulesSection.svelte
+++ /dev/null
@@ -1,201 +0,0 @@
-<script lang="ts">
-	import { AppFormStack, AppNotice } from '$lib/components/layout';
-	import Icon from '$lib/components/Icon.svelte';
-	import { m } from '$lib/paraglide/messages.js';
-	import {
-		CwButton,
-		CwDropdown,
-		CwExpandPanel,
-		CwInput,
-		CwSwitch
-	} from '@cropwatchdevelopment/cwui';
-	import ADD_ICON from '$lib/images/icons/add.svg';
-	import type { DataProcessingScheduleDraft, SelectOption } from './report-form.types';
-
-	interface Props {
-		schedules?: DataProcessingScheduleDraft[];
-		daysOfTheWeek: SelectOption[];
-		ruleTypeOptions: SelectOption[];
-		onAdd: () => void;
-		onRemove: (key: string) => void;
-	}
-
-	let {
-		schedules = $bindable<DataProcessingScheduleDraft[]>([]),
-		daysOfTheWeek,
-		ruleTypeOptions,
-		onAdd,
-		onRemove
-	}: Props = $props();
-
-	let open = $state(schedules.length > 0);
-</script>
-
-<CwExpandPanel title={m.reports_schedule_card_title()} {open}>
-	<AppFormStack padded>
-		<div class="report-section-toolbar">
-			<p class="report-section-copy">{m.reports_schedule_card_copy()}</p>
-			<CwButton type="button" variant="secondary" onclick={onAdd}>
-				<Icon src={ADD_ICON} class="h-4 w-4" />
-			</CwButton>
-		</div>
-
-		{#if schedules.length === 0}
-			<AppNotice tone="neutral">
-				<p>{m.reports_schedule_empty()}</p>
-			</AppNotice>
-		{/if}
-
-		{#each schedules as schedule, index (schedule.key)}
-			<div class="report-entry-card">
-				<div class="report-entry-card__header report-entry-card__header--spread">
-					<div>
-						<h3>{m.reports_schedule_entry_heading({ index: String(index + 1) })}</h3>
-					</div>
-					<CwButton type="button" variant="danger" size="sm" onclick={() => onRemove(schedule.key)}>
-						{m.action_remove()}
-					</CwButton>
-				</div>
-
-				<div class="report-field-grid report-field-grid--three">
-					<CwDropdown
-						label={m.reports_schedule_day_of_week()}
-						options={daysOfTheWeek}
-						bind:value={schedule.day_of_week}
-					/>
-					<CwDropdown
-						label={m.reports_schedule_rule_type()}
-						options={ruleTypeOptions}
-						bind:value={schedule.rule_type}
-					/>
-					<CwInput
-						label={m.reports_schedule_timezone()}
-						placeholder="UTC, JST, EST, etc..."
-						bind:value={schedule.timezone}
-					/>
-				</div>
-
-				<div class="report-field-grid report-field-grid--two">
-					<label class="report-time-field">
-						<span class="report-time-field__label">{m.reports_schedule_start_time()}</span>
-						<input class="report-time-input" type="time" bind:value={schedule.start_time} />
-					</label>
-					<label class="report-time-field">
-						<span class="report-time-field__label">{m.reports_schedule_end_time()}</span>
-						<input class="report-time-input" type="time" bind:value={schedule.end_time} />
-					</label>
-				</div>
-
-				<div class="report-switch-grid">
-					<CwSwitch
-						checked={schedule.crosses_midnight}
-						label={m.reports_schedule_crosses_midnight()}
-						description={m.reports_schedule_crosses_midnight_description()}
-						onchange={(checked) => (schedule.crosses_midnight = checked)}
-					/>
-					<CwSwitch
-						checked={schedule.is_enabled}
-						label={m.reports_schedule_is_enabled()}
-						description={m.reports_schedule_is_enabled_description()}
-						onchange={(checked) => (schedule.is_enabled = checked)}
-					/>
-				</div>
-			</div>
-		{/each}
-	</AppFormStack>
-</CwExpandPanel>
-
-<style>
-	.report-section-toolbar,
-	.report-entry-card__header--spread {
-		display: flex;
-		align-items: flex-start;
-		justify-content: space-between;
-		gap: var(--cw-space-3);
-	}
-
-	.report-section-copy {
-		margin: 0;
-		max-width: 48rem;
-		color: var(--cw-text-secondary);
-	}
-
-	.report-entry-card {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-3);
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.report-entry-card__header h3 {
-		margin: 0;
-		font-size: 1rem;
-		font-weight: var(--cw-font-semibold);
-	}
-
-	.report-field-grid,
-	.report-switch-grid {
-		display: grid;
-		gap: var(--cw-space-3);
-	}
-
-	.report-field-grid--two {
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-	}
-
-	.report-field-grid--three {
-		grid-template-columns: repeat(3, minmax(0, 1fr));
-	}
-
-	.report-switch-grid {
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-	}
-
-	.report-time-field {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-1);
-	}
-
-	.report-time-field__label {
-		color: var(--cw-text-secondary);
-		font-size: 0.8125rem;
-		font-weight: var(--cw-font-medium);
-	}
-
-	.report-time-input {
-		width: 100%;
-		padding: 0.625rem 0.75rem;
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-md);
-		background: var(--cw-bg-surface);
-		color: var(--cw-text-primary);
-		font: inherit;
-	}
-
-	.report-time-input:focus {
-		outline: none;
-		border-color: var(--cw-primary-500);
-		box-shadow: 0 0 0 1px color-mix(in srgb, var(--cw-primary-500) 35%, transparent);
-	}
-
-	@media (max-width: 767px) {
-		.report-field-grid--three,
-		.report-switch-grid {
-			grid-template-columns: 1fr;
-		}
-	}
-
-	@media (max-width: 639px) {
-		.report-field-grid--two,
-		.report-section-toolbar,
-		.report-entry-card__header--spread {
-			grid-template-columns: 1fr;
-			flex-direction: column;
-			align-items: stretch;
-		}
-	}
-</style>
diff --git a/src/routes/reports/[report_id]/edit/ReportRecipientsSection.svelte b/src/routes/reports/[report_id]/edit/ReportRecipientsSection.svelte
deleted file mode 100644
index 00df7d31..00000000
--- a/src/routes/reports/[report_id]/edit/ReportRecipientsSection.svelte
+++ /dev/null
@@ -1,137 +0,0 @@
-<script lang="ts">
-	import { AppFormStack, AppNotice } from '$lib/components/layout';
-	import Icon from '$lib/components/Icon.svelte';
-	import { m } from '$lib/paraglide/messages.js';
-	import { CwButton, CwCard, CwDropdown, CwInput } from '@cropwatchdevelopment/cwui';
-	import ADD_ICON from '$lib/images/icons/add.svg';
-	import type { RecipientDraft, SelectOption } from './report-form.types';
-
-	interface Props {
-		recipients?: RecipientDraft[];
-		communicationMethodOptions: SelectOption[];
-		onAdd: () => void;
-		onRemove: (key: string) => void;
-	}
-
-	let {
-		recipients = $bindable<RecipientDraft[]>([]),
-		communicationMethodOptions,
-		onAdd,
-		onRemove
-	}: Props = $props();
-</script>
-
-<CwCard
-	title={m.reports_create_recipients_title()} elevated>
-	<AppFormStack padded>
-		<div class="report-section-toolbar">
-			<p class="report-section-copy">{m.reports_create_recipients_copy()}</p>
-			<CwButton type="button" variant="secondary" onclick={onAdd}>
-				<Icon src={ADD_ICON} class="h-4 w-4" />
-			</CwButton>
-		</div>
-
-		{#if recipients.length === 0}
-			<AppNotice tone="neutral">
-				<p>{m.reports_create_empty_recipients()}</p>
-			</AppNotice>
-		{/if}
-
-		{#each recipients as recipient, index (recipient.key)}
-			<div class="report-entry-card">
-				<div class="report-entry-card__header report-entry-card__header--spread">
-					<div>
-						<h3>{m.reports_create_recipient_heading({ index: String(index + 1) })}</h3>
-						<p>{m.reports_create_recipient_copy()}</p>
-					</div>
-					{#if recipients.length > 1}
-						<CwButton
-							type="button"
-							variant="danger"
-							size="sm"
-							onclick={() => onRemove(recipient.key)}
-						>
-							{m.action_remove()}
-						</CwButton>
-					{/if}
-				</div>
-
-				<div class="report-field-grid report-field-grid--three">
-					<CwDropdown
-						label={m.reports_create_communication_method()}
-						options={communicationMethodOptions}
-						bind:value={recipient.communication_method}
-					/>
-					<CwInput
-						label={m.reports_create_email_label()}
-						type="email"
-						placeholder={m.reports_create_email_placeholder()}
-						bind:value={recipient.email}
-					/>
-					<CwInput
-						label={m.common_name()}
-						placeholder={m.reports_create_recipient_name_placeholder()}
-						bind:value={recipient.name}
-					/>
-				</div>
-			</div>
-		{/each}
-	</AppFormStack>
-</CwCard>
-
-<style>
-	.report-section-toolbar,
-	.report-entry-card__header--spread {
-		display: flex;
-		align-items: flex-start;
-		justify-content: space-between;
-		gap: var(--cw-space-3);
-	}
-
-	.report-section-copy {
-		margin: 0;
-		max-width: 48rem;
-		color: var(--cw-text-secondary);
-	}
-
-	.report-entry-card {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-3);
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.report-entry-card__header h3 {
-		margin: 0;
-		font-size: 1rem;
-		font-weight: var(--cw-font-semibold);
-	}
-
-	.report-entry-card__header p {
-		margin: var(--cw-space-1) 0 0;
-		color: var(--cw-text-secondary);
-	}
-
-	.report-field-grid {
-		display: grid;
-		grid-template-columns: repeat(3, minmax(0, 1fr));
-		gap: var(--cw-space-3);
-	}
-
-	@media (max-width: 767px) {
-		.report-field-grid {
-			grid-template-columns: 1fr;
-		}
-	}
-
-	@media (max-width: 639px) {
-		.report-section-toolbar,
-		.report-entry-card__header--spread {
-			flex-direction: column;
-			align-items: stretch;
-		}
-	}
-</style>
diff --git a/src/routes/reports/[report_id]/edit/alert-points-editor-text.ts b/src/routes/reports/[report_id]/edit/alert-points-editor-text.ts
deleted file mode 100644
index 3fe601bd..00000000
--- a/src/routes/reports/[report_id]/edit/alert-points-editor-text.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-import { getUiLocale } from '$lib/i18n/format';
-import { m } from '$lib/paraglide/messages.js';
-import type { CwAlertPointsEditorText } from '@cropwatchdevelopment/cwui';
-
-export function createReportAlertPointsEditorText(): CwAlertPointsEditorText {
-	return {
-		unitFieldLabel: m.reports_create_alert_points_unit_label(),
-		centerFieldLabel: m.reports_create_alert_points_center_label(),
-		nameFieldLabel: m.common_name(),
-		conditionFieldLabel: m.reports_create_alert_operator(),
-		valueFieldLabel: m.reports_create_alert_value(),
-		minValueFieldLabel: m.reports_create_alert_minimum(),
-		maxValueFieldLabel: m.reports_create_alert_maximum(),
-		colorFieldLabel: m.reports_create_alert_hex_color(),
-		addAlertPointButton: m.reports_create_add_alert(),
-		removePointButton: m.action_remove(),
-		emptyTitle: m.reports_create_alert_points_empty_title(),
-		emptyDescription: m.reports_create_alert_points_empty_description(),
-		invalidNumberError: m.reports_create_alert_points_invalid_number(),
-		requiredFieldError: (label) => m.reports_create_alert_points_required_field({ label }),
-		fieldLabelWithUnit: (label, unit) =>
-			m.reports_create_alert_points_label_with_unit({ label, unit }),
-		invalidPreviewNote: (count) =>
-			count === 1
-				? m.reports_create_alert_points_invalid_preview_single()
-				: m.reports_create_alert_points_invalid_preview_multiple({
-						count: String(count)
-					}),
-		overlapPreviewNote: (count) =>
-			count === 1
-				? m.reports_create_alert_points_overlap_preview_single()
-				: m.reports_create_alert_points_overlap_preview_multiple({
-						count: String(count)
-					}),
-		minEqualsMaxWarning: m.reports_create_alert_points_equal_bounds_warning(),
-		defaultPointName: (index) => m.reports_create_alert_heading({ index: String(index) }),
-		unitCelsiusLabel: '°C',
-		unitFahrenheitLabel: '°F',
-		unitKelvinLabel: '°K',
-		conditionEqualsLabel: m.reports_create_alert_points_condition_equals(),
-		conditionRangeLabel: m.reports_create_alert_points_condition_range(),
-		conditionLessThanLabel: m.reports_create_alert_points_condition_less_than(),
-		conditionLessThanOrEqualLabel: m.reports_create_alert_points_condition_less_than_or_equal(),
-		conditionGreaterThanLabel: m.reports_create_alert_points_condition_greater_than(),
-		conditionGreaterThanOrEqualLabel:
-			m.reports_create_alert_points_condition_greater_than_or_equal(),
-		pointDescriptionWaitingForValue: m.reports_create_alert_points_waiting_for_value(),
-		pointDescriptionWaitingForThreshold: m.reports_create_alert_points_waiting_for_threshold(),
-		pointDescriptionRangeMissingBounds: m.reports_create_alert_points_range_missing_bounds(),
-		pointDescriptionEquals: (value, unit) =>
-			m.reports_create_alert_points_description_equals({ value, unit }),
-		pointDescriptionRange: (min, max, unit) =>
-			m.reports_create_alert_points_description_range({ min, max, unit }),
-		pointDescriptionLessThan: (value, unit) =>
-			m.reports_create_alert_points_description_less_than({ value, unit }),
-		pointDescriptionLessThanOrEqual: (value, unit) =>
-			m.reports_create_alert_points_description_less_than_or_equal({ value, unit }),
-		pointDescriptionGreaterThan: (value, unit) =>
-			m.reports_create_alert_points_description_greater_than({ value, unit }),
-		pointDescriptionGreaterThanOrEqual: (value, unit) =>
-			m.reports_create_alert_points_description_greater_than_or_equal({ value, unit }),
-		overlapError: (labels) =>
-			m.reports_create_alert_points_overlap_error({
-				labels: labels.join(getUiLocale() === 'ja' ? '、' : ', ')
-			})
-	};
-}
diff --git a/src/routes/reports/[report_id]/edit/data-pull-interval.ts b/src/routes/reports/[report_id]/edit/data-pull-interval.ts
deleted file mode 100644
index e5eaad1f..00000000
--- a/src/routes/reports/[report_id]/edit/data-pull-interval.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-import type { SelectOption } from './report-form.types';
-
-export const DEFAULT_REPORT_DATA_PULL_INTERVAL = '30';
-
-const BASE_REPORT_DATA_PULL_INTERVAL_OPTIONS: ReadonlyArray<SelectOption> = Object.freeze([
-	{ label: '30 minutes', value: '30' },
-	{ label: '1 hour', value: '60' }
-]);
-
-function readPositiveInteger(value: unknown): number | undefined {
-	if (typeof value === 'number' && Number.isInteger(value) && value > 0) {
-		return value;
-	}
-
-	if (typeof value !== 'string') {
-		return undefined;
-	}
-
-	const normalized = value.trim();
-	if (!normalized) {
-		return undefined;
-	}
-
-	const parsed = Number.parseInt(normalized, 10);
-	return Number.isInteger(parsed) && parsed > 0 ? parsed : undefined;
-}
-
-function formatIntervalLabel(minutes: number): string {
-	if (minutes % 60 === 0) {
-		const hours = minutes / 60;
-		return hours === 1 ? '1 hour' : `${hours} hours`;
-	}
-
-	return `${minutes} minutes`;
-}
-
-export function parseReportDataPullInterval(value: unknown): number | undefined {
-	return readPositiveInteger(value);
-}
-
-export function normalizeReportDataPullInterval(
-	value: unknown,
-	fallback = DEFAULT_REPORT_DATA_PULL_INTERVAL
-): string {
-	return String(readPositiveInteger(value) ?? fallback);
-}
-
-export function buildReportDataPullIntervalOptions(
-	currentValue: unknown
-): ReadonlyArray<SelectOption> {
-	const normalizedValue = readPositiveInteger(currentValue);
-
-	if (
-		normalizedValue === undefined ||
-		BASE_REPORT_DATA_PULL_INTERVAL_OPTIONS.some(
-			(option) => option.value === String(normalizedValue)
-		)
-	) {
-		return BASE_REPORT_DATA_PULL_INTERVAL_OPTIONS;
-	}
-
-	return [
-		{
-			label: formatIntervalLabel(normalizedValue),
-			value: String(normalizedValue)
-		},
-		...BASE_REPORT_DATA_PULL_INTERVAL_OPTIONS
-	];
-}
diff --git a/src/routes/reports/[report_id]/edit/report-action.server.ts b/src/routes/reports/[report_id]/edit/report-action.server.ts
deleted file mode 100644
index c7d40628..00000000
--- a/src/routes/reports/[report_id]/edit/report-action.server.ts
+++ /dev/null
@@ -1,421 +0,0 @@
-import { ApiServiceError } from '$lib/api/api.service';
-import type {
-	CreateReportAlertPointRequest,
-	CreateReportDataProcessingScheduleRequest,
-	CreateReportRecipientRequest,
-	CreateReportRequest,
-	CreateReportUserScheduleRequest
-} from '$lib/api/api.dtos';
-
-export type CurrentUser = {
-	id: string;
-	email: string;
-	name: string;
-};
-
-export const REPORT_CREATED_SUCCESS_MESSAGE = 'Report created successfully.';
-export const REPORT_UPDATED_SUCCESS_MESSAGE = 'Report updated successfully.';
-export const REPORT_UPDATE_FAILED_MESSAGE = 'Failed to update report.';
-
-export const readString = (value: unknown): string =>
-	typeof value === 'string'
-		? value.trim()
-		: typeof value === 'number' && Number.isFinite(value)
-			? String(value)
-			: '';
-
-const readOptionalString = (value: unknown): string | undefined => {
-	const normalized = readString(value);
-	return normalized.length > 0 ? normalized : undefined;
-};
-
-const readOptionalInteger = (value: unknown): number | undefined => {
-	if (typeof value === 'number' && Number.isInteger(value)) {
-		return value;
-	}
-
-	const normalized = readString(value);
-	if (!normalized) return undefined;
-
-	const parsed = Number.parseInt(normalized, 10);
-	return Number.isFinite(parsed) ? parsed : undefined;
-};
-
-const readOptionalPositiveInteger = (value: unknown): number | undefined => {
-	const parsed = readOptionalInteger(value);
-	return parsed !== undefined && parsed > 0 ? parsed : undefined;
-};
-
-const readOptionalNumber = (value: unknown): number | undefined => {
-	if (typeof value === 'number' && Number.isFinite(value)) {
-		return value;
-	}
-
-	const normalized = readString(value);
-	if (!normalized) return undefined;
-
-	const parsed = Number(normalized);
-	return Number.isFinite(parsed) ? parsed : undefined;
-};
-
-const readOptionalBoolean = (value: unknown, fallback?: boolean): boolean | undefined => {
-	if (typeof value === 'boolean') {
-		return value;
-	}
-
-	if (typeof value === 'string') {
-		const normalized = value.trim().toLowerCase();
-		if (normalized === 'true') return true;
-		if (normalized === 'false') return false;
-	}
-
-	return fallback;
-};
-
-const normalizeDevEui = (value: string): string =>
-	value
-		.replace(/[^0-9a-fA-F]/g, '')
-		.toUpperCase()
-		.slice(0, 16);
-
-const isRecord = (value: unknown): value is Record<string, unknown> =>
-	typeof value === 'object' && value !== null && !Array.isArray(value);
-
-export function readApiMessage(sourceError: unknown, fallback: string): string {
-	if (sourceError instanceof ApiServiceError) {
-		const payload = sourceError.payload as { payload?: { message?: unknown } } | null;
-		const message = payload?.payload?.message;
-
-		if (typeof message === 'string' && message.trim()) {
-			return message.trim();
-		}
-
-		if (Array.isArray(message)) {
-			const text = message
-				.filter((entry): entry is string => typeof entry === 'string' && entry.trim().length > 0)
-				.join(', ');
-
-			if (text) return text;
-		}
-	}
-
-	if (sourceError instanceof Error && sourceError.message.trim()) {
-		return sourceError.message.trim();
-	}
-
-	return fallback;
-}
-
-export function readReportId(payload: unknown): string | null {
-	if (!isRecord(payload)) {
-		return null;
-	}
-
-	const reportId = payload.report_id;
-	if (typeof reportId === 'string' && reportId.trim()) {
-		return reportId.trim();
-	}
-
-	for (const nestedKey of ['data', 'result']) {
-		const nestedReportId = readReportId(payload[nestedKey]);
-		if (nestedReportId) {
-			return nestedReportId;
-		}
-	}
-
-	return null;
-}
-
-export function readApiStatus(sourceError: unknown, fallback = 500): number {
-	if (
-		sourceError instanceof ApiServiceError &&
-		Number.isInteger(sourceError.status) &&
-		sourceError.status >= 400 &&
-		sourceError.status < 600
-	) {
-		return sourceError.status;
-	}
-
-	return fallback;
-}
-
-export function parsePayload(
-	formData: FormData
-): { raw: string; value: Record<string, unknown> } | null {
-	const raw = readString(formData.get('payload'));
-	if (!raw) {
-		return null;
-	}
-
-	try {
-		const parsed = JSON.parse(raw) as unknown;
-		if (!isRecord(parsed)) {
-			return null;
-		}
-
-		return { raw, value: parsed };
-	} catch {
-		return null;
-	}
-}
-
-function sanitizeScheduleEntries(
-	value: unknown,
-	defaults: {
-		dev_eui: string;
-		report_id?: string;
-		user_id?: string;
-	}
-): CreateReportUserScheduleRequest[] | undefined {
-	if (!Array.isArray(value)) return undefined;
-
-	const schedules = value
-		.filter(isRecord)
-		.map((entry) => {
-			const devEuiSource = readOptionalString(entry.dev_eui);
-			const devEui = normalizeDevEui(devEuiSource ?? defaults.dev_eui);
-			if (!devEui) {
-				return null;
-			}
-
-			const schedule: CreateReportUserScheduleRequest = {
-				dev_eui: devEui,
-				end_of_day: readOptionalBoolean(entry.end_of_day, false) ?? false,
-				end_of_week: readOptionalBoolean(entry.end_of_week, false) ?? false,
-				is_active: readOptionalBoolean(entry.is_active, true) ?? true
-			};
-
-			const createdAt = readOptionalString(entry.created_at);
-			const id = readOptionalInteger(entry.id);
-			const reportId = readOptionalString(entry.report_id) ?? defaults.report_id;
-			const reportUserScheduleId = readOptionalInteger(entry.report_user_schedule_id);
-			const userId = readOptionalString(entry.user_id) ?? defaults.user_id;
-
-			if (createdAt) schedule.created_at = createdAt;
-			if (id !== undefined) schedule.id = id;
-			if (reportId) schedule.report_id = reportId;
-			if (reportUserScheduleId !== undefined) {
-				schedule.report_user_schedule_id = reportUserScheduleId;
-			}
-			if (userId) schedule.user_id = userId;
-
-			return schedule;
-		})
-		.filter((entry): entry is CreateReportUserScheduleRequest => entry !== null);
-
-	return schedules.length > 0 ? schedules : undefined;
-}
-
-function sanitizeAlertEntries(
-	value: unknown,
-	defaults: {
-		report_id?: string;
-		user_id?: string;
-	}
-): CreateReportAlertPointRequest[] | undefined {
-	if (!Array.isArray(value)) return undefined;
-
-	const alerts = value
-		.filter(isRecord)
-		.map((entry) => {
-			const name = readOptionalString(entry.name);
-			const dataPointKey = readOptionalString(entry.data_point_key);
-
-			if (!name || !dataPointKey) {
-				return null;
-			}
-
-			const alert: CreateReportAlertPointRequest = {
-				name,
-				data_point_key: dataPointKey
-			};
-
-			const createdAt = readOptionalString(entry.created_at);
-			const hexColor = readOptionalString(entry.hex_color);
-			const id = readOptionalInteger(entry.id);
-			const max = readOptionalNumber(entry.max);
-			const min = readOptionalNumber(entry.min);
-			const operator = readOptionalString(entry.operator);
-			const reportId = readOptionalString(entry.report_id) ?? defaults.report_id;
-			const userId = readOptionalString(entry.user_id) ?? defaults.user_id;
-			const valueNumber = readOptionalNumber(entry.value);
-
-			if (createdAt) alert.created_at = createdAt;
-			if (hexColor) alert.hex_color = hexColor;
-			if (id !== undefined) alert.id = id;
-			if (max !== undefined) alert.max = max;
-			if (min !== undefined) alert.min = min;
-			if (operator) alert.operator = operator;
-			if (reportId) alert.report_id = reportId;
-			if (userId) alert.user_id = userId;
-			if (valueNumber !== undefined) alert.value = valueNumber;
-
-			return alert;
-		})
-		.filter((entry): entry is CreateReportAlertPointRequest => entry !== null);
-
-	return alerts.length > 0 ? alerts : undefined;
-}
-
-function sanitizeRecipientEntries(
-	value: unknown,
-	defaults: {
-		report_id?: string;
-		user_id?: string;
-	}
-): CreateReportRecipientRequest[] | undefined {
-	if (!Array.isArray(value)) return undefined;
-
-	const recipients = value
-		.filter(isRecord)
-		.map((entry) => {
-			const communicationMethod = readOptionalInteger(entry.communication_method);
-			const email = readOptionalString(entry.email);
-			const name = readOptionalString(entry.name);
-			const userId = readOptionalString(entry.user_id) ?? defaults.user_id;
-
-			if (!communicationMethod || (!email && !userId)) {
-				return null;
-			}
-
-			const recipient: CreateReportRecipientRequest = {
-				communication_method: communicationMethod
-			};
-
-			const createdAt = readOptionalString(entry.created_at);
-			const id = readOptionalInteger(entry.id);
-			const reportId = readOptionalString(entry.report_id) ?? defaults.report_id;
-
-			if (createdAt) recipient.created_at = createdAt;
-			if (email) recipient.email = email;
-			if (id !== undefined) recipient.id = id;
-			if (name) recipient.name = name;
-			if (reportId) recipient.report_id = reportId;
-			if (userId) recipient.user_id = userId;
-
-			return recipient;
-		})
-		.filter((entry): entry is CreateReportRecipientRequest => entry !== null);
-
-	return recipients.length > 0 ? recipients : undefined;
-}
-
-function sanitizeDataProcessingScheduleEntries(
-	value: unknown,
-	defaults: { report_id?: string }
-): CreateReportDataProcessingScheduleRequest[] | undefined {
-	if (!Array.isArray(value)) return undefined;
-
-	const timePattern = /^(\d{2}:\d{2})(?::\d{2})?$/;
-	const normalizeTime = (time: unknown): string | undefined => {
-		if (typeof time !== 'string') return undefined;
-		const match = timePattern.exec(time.trim());
-		return match ? match[1] : undefined;
-	};
-
-	const entries = value
-		.filter(isRecord)
-		.map((entry) => {
-			const dayOfWeek = readOptionalInteger(entry.day_of_week);
-			const startTime = normalizeTime(entry.start_time);
-			const endTime = normalizeTime(entry.end_time);
-
-			if (dayOfWeek === undefined || !startTime || !endTime) {
-				return null;
-			}
-
-			const schedule: CreateReportDataProcessingScheduleRequest = {
-				day_of_week: dayOfWeek,
-				start_time: startTime,
-				end_time: endTime
-			};
-
-			const crossesMidnight = readOptionalBoolean(entry.crosses_midnight);
-			const id = readOptionalString(entry.id);
-			const isEnabled = readOptionalBoolean(entry.is_enabled);
-			const reportId = readOptionalString(entry.report_id) ?? defaults.report_id;
-			const ruleType = readOptionalString(entry.rule_type);
-			const timezone = readOptionalString(entry.timezone);
-
-			if (crossesMidnight !== undefined) schedule.crosses_midnight = crossesMidnight;
-			if (id) schedule.id = id;
-			if (isEnabled !== undefined) schedule.is_enabled = isEnabled;
-			if (reportId) schedule.report_id = reportId;
-			if (ruleType) schedule.rule_type = ruleType;
-			if (timezone) schedule.timezone = timezone;
-
-			return schedule;
-		})
-		.filter((entry): entry is CreateReportDataProcessingScheduleRequest => entry !== null);
-
-	return entries.length > 0 ? entries : undefined;
-}
-
-export function sanitizeReportPayload(
-	payload: Record<string, unknown>,
-	defaults: {
-		report_id?: string;
-		user_id?: string;
-	}
-): CreateReportRequest {
-	const name = readString(payload.name);
-	const devEui = normalizeDevEui(readString(payload.dev_eui));
-	const reportId = readOptionalString(payload.report_id) ?? defaults.report_id;
-	const userId = readOptionalString(payload.user_id) ?? defaults.user_id;
-
-	const sanitized: CreateReportRequest = {
-		name,
-		dev_eui: devEui
-	};
-
-	const createdAt = readOptionalString(payload.created_at);
-	const dataPullInterval = readOptionalPositiveInteger(payload.data_pull_interval);
-	const id = readOptionalInteger(payload.id);
-
-	if (createdAt) sanitized.created_at = createdAt;
-	if (dataPullInterval !== undefined) sanitized.data_pull_interval = dataPullInterval;
-	if (id !== undefined) sanitized.id = id;
-	if (reportId) sanitized.report_id = reportId;
-	if (userId) sanitized.user_id = userId;
-
-	const reportUserSchedule = sanitizeScheduleEntries(payload.report_user_schedule, {
-		dev_eui: devEui,
-		report_id: reportId,
-		user_id: userId
-	});
-	const reportAlertPoints = sanitizeAlertEntries(payload.report_alert_points, {
-		report_id: reportId,
-		user_id: userId
-	});
-	const reportRecipients = sanitizeRecipientEntries(payload.report_recipients, {
-		report_id: reportId,
-		user_id: userId
-	});
-	const reportDataProcessingSchedules = sanitizeDataProcessingScheduleEntries(
-		payload.report_data_processing_schedules,
-		{ report_id: reportId }
-	);
-
-	if (reportUserSchedule) sanitized.report_user_schedule = reportUserSchedule;
-	if (reportAlertPoints) sanitized.report_alert_points = reportAlertPoints;
-	if (reportRecipients) sanitized.report_recipients = reportRecipients;
-	if (reportDataProcessingSchedules) {
-		sanitized.report_data_processing_schedules = reportDataProcessingSchedules;
-	}
-
-	return sanitized;
-}
-
-export function readCurrentUser(locals: App.Locals): CurrentUser | null {
-	const jwt = locals.jwt;
-	const id = jwt?.sub?.trim();
-	if (!jwt || !id) {
-		return null;
-	}
-
-	const email = jwt.user_metadata?.email?.trim() || jwt.email?.trim() || '';
-	const name =
-		jwt.user_metadata?.full_name?.trim() || jwt.user_metadata?.name?.trim() || email || id;
-
-	return { id, email, name };
-}
diff --git a/src/routes/reports/[report_id]/edit/report-form.ts b/src/routes/reports/[report_id]/edit/report-form.ts
deleted file mode 100644
index db19be4b..00000000
--- a/src/routes/reports/[report_id]/edit/report-form.ts
+++ /dev/null
@@ -1,542 +0,0 @@
-import type {
-	CreateReportAlertPointRequest,
-	CreateReportDataProcessingScheduleRequest,
-	CreateReportRecipientRequest,
-	CreateReportRequest,
-	CreateReportUserScheduleRequest,
-	ReportDto
-} from '$lib/api/api.dtos';
-import { m } from '$lib/paraglide/messages.js';
-import type { CwAlertPointCondition, CwAlertPointsValue } from '@cropwatchdevelopment/cwui';
-import {
-	DEFAULT_REPORT_DATA_PULL_INTERVAL,
-	normalizeReportDataPullInterval,
-	parseReportDataPullInterval
-} from './data-pull-interval';
-import type {
-	DataProcessingScheduleDraft,
-	RecipientDraft,
-	ReportDraft,
-	ScheduleDraft
-} from './report-form.types';
-
-export type CurrentUser = {
-	email: string;
-	id: string;
-	name: string;
-} | null;
-
-type ReportDraftFactoryOptions = {
-	currentUser: CurrentUser;
-	initialDevEui?: string | null;
-	nextRowKey: (prefix: string) => string;
-	report: ReportDto | null;
-};
-
-const DEFAULT_ALERT_COLOR = '';
-const DEFAULT_ALERT_DATA_POINT_KEY = 'temperature_c';
-
-export function normalizeDevEui(value: string): string {
-	return value
-		.replace(/[^0-9a-fA-F]/g, '')
-		.toUpperCase()
-		.slice(0, 16);
-}
-
-export function cleanOptional(value: string): string | undefined {
-	const trimmed = value.trim();
-	return trimmed.length > 0 ? trimmed : undefined;
-}
-
-export function parseOptionalInteger(value: string): number | undefined {
-	const normalized = cleanOptional(value);
-	if (!normalized) return undefined;
-
-	const parsed = Number.parseInt(normalized, 10);
-	return Number.isFinite(parsed) ? parsed : undefined;
-}
-
-export function parseOptionalNumber(value: string): number | undefined {
-	const normalized = cleanOptional(value);
-	if (!normalized) return undefined;
-
-	const parsed = Number(normalized);
-	return Number.isFinite(parsed) ? parsed : undefined;
-}
-
-export function preventImplicitFormSubmission(node: HTMLFormElement) {
-	function normalizeButtonTypes() {
-		for (const button of node.querySelectorAll<HTMLButtonElement>('button:not([type])')) {
-			button.type = 'button';
-		}
-	}
-
-	function handleKeydown(event: KeyboardEvent) {
-		if (event.key !== 'Enter' || event.defaultPrevented) return;
-
-		const target = event.target;
-		if (!(target instanceof HTMLElement)) return;
-		if (target instanceof HTMLButtonElement) return;
-		if (target instanceof HTMLTextAreaElement || target instanceof HTMLSelectElement) return;
-		if (target instanceof HTMLInputElement) {
-			if (['button', 'checkbox', 'file', 'radio', 'reset', 'submit'].includes(target.type)) {
-				return;
-			}
-		}
-
-		event.preventDefault();
-	}
-
-	normalizeButtonTypes();
-
-	const observer = new MutationObserver(() => {
-		normalizeButtonTypes();
-	});
-
-	observer.observe(node, { childList: true, subtree: true });
-	node.addEventListener('keydown', handleKeydown);
-
-	return () => {
-		observer.disconnect();
-		node.removeEventListener('keydown', handleKeydown);
-	};
-}
-
-export function createEmptyAlertPointsValue(): CwAlertPointsValue {
-	return {
-		unit: 'C',
-		center: '0',
-		points: []
-	};
-}
-
-function mapAlertConditionToOperator(condition: CwAlertPointCondition): string {
-	switch (condition) {
-		case 'greaterThan':
-			return '>';
-		case 'greaterThanOrEqual':
-			return '>=';
-		case 'lessThan':
-			return '<';
-		case 'lessThanOrEqual':
-			return '<=';
-		case 'range':
-			return 'range';
-		case 'equals':
-		default:
-			return '=';
-	}
-}
-
-function mapOperatorToAlertCondition(operator: string | null | undefined): CwAlertPointCondition {
-	switch (operator) {
-		case '>':
-			return 'greaterThan';
-		case '>=':
-			return 'greaterThanOrEqual';
-		case '<':
-			return 'lessThan';
-		case '<=':
-			return 'lessThanOrEqual';
-		case 'range':
-			return 'range';
-		case '=':
-		default:
-			return 'equals';
-	}
-}
-
-export function createReportDraftFactory({
-	currentUser,
-	initialDevEui = '',
-	nextRowKey,
-	report
-}: ReportDraftFactoryOptions) {
-	function createEmptySchedule(rootUserId = currentUser?.id ?? ''): ScheduleDraft {
-		return {
-			created_at: '',
-			dev_eui: '',
-			end_of_day: false,
-			end_of_week: true,
-			id: '',
-			is_active: true,
-			key: nextRowKey('schedule'),
-			report_id: report?.report_id ?? '',
-			report_user_schedule_id: '',
-			user_id: rootUserId
-		};
-	}
-
-	function createEmptyDataProcessingSchedule(): DataProcessingScheduleDraft {
-		return {
-			crosses_midnight: false,
-			day_of_week: '1',
-			end_time: '17:00',
-			id: '',
-			is_enabled: true,
-			key: nextRowKey('dps'),
-			report_id: report?.report_id ?? '',
-			rule_type: 'include',
-			start_time: '09:00',
-			timezone: 'JST'
-		};
-	}
-
-	function createEmptyRecipient(rootUserId = currentUser?.id ?? ''): RecipientDraft {
-		return {
-			communication_method: '1',
-			created_at: '',
-			email: currentUser?.email ?? '',
-			id: '',
-			key: nextRowKey('recipient'),
-			name: currentUser?.name ?? '',
-			report_id: report?.report_id ?? '',
-			user_id: rootUserId
-		};
-	}
-
-	function buildDefaultDraft(): ReportDraft {
-		return {
-			created_at: '',
-			data_pull_interval: DEFAULT_REPORT_DATA_PULL_INTERVAL,
-			dev_eui: normalizeDevEui(initialDevEui ?? ''),
-			id: '',
-			name: '',
-			report_id: '',
-			report_data_processing_schedules: [],
-			report_recipients: [createEmptyRecipient()],
-			report_user_schedule: [createEmptySchedule()],
-			user_id: currentUser?.id ?? ''
-		};
-	}
-
-	function buildDraftFromReport(source: ReportDto): ReportDraft {
-		const normalizedReportDevEui = normalizeDevEui(source.dev_eui ?? '');
-		const rootUserId = cleanOptional(source.user_id ?? '') ?? currentUser?.id ?? '';
-		const reportId = source.report_id ?? '';
-
-		const schedules =
-			source.report_user_schedule?.map((schedule) => {
-				const scheduleDevEui = normalizeDevEui(schedule.dev_eui ?? '');
-
-				return {
-					created_at: schedule.created_at ?? '',
-					dev_eui: scheduleDevEui === normalizedReportDevEui ? '' : scheduleDevEui,
-					end_of_day: schedule.end_of_day ?? false,
-					end_of_week: schedule.end_of_week ?? false,
-					id: schedule.id != null ? String(schedule.id) : '',
-					is_active: schedule.is_active ?? true,
-					key: nextRowKey('schedule'),
-					report_id: cleanOptional(schedule.report_id ?? '') ?? reportId,
-					report_user_schedule_id:
-						schedule.report_user_schedule_id != null
-							? String(schedule.report_user_schedule_id)
-							: '',
-					user_id: cleanOptional(schedule.user_id ?? '') ?? rootUserId
-				};
-			}) ?? [];
-
-		const recipients =
-			source.report_recipients?.map((recipient) => ({
-				communication_method:
-					recipient.communication_method != null ? String(recipient.communication_method) : '1',
-				created_at: recipient.created_at ?? '',
-				email: recipient.email ?? '',
-				id: recipient.id != null ? String(recipient.id) : '',
-				key: nextRowKey('recipient'),
-				name: recipient.name ?? '',
-				report_id: cleanOptional(recipient.report_id ?? '') ?? reportId,
-				user_id: cleanOptional(recipient.user_id ?? '') ?? rootUserId
-			})) ?? [];
-
-		const dataProcessingSchedules =
-			source.report_data_processing_schedules?.map((schedule) => ({
-				crosses_midnight: schedule.crosses_midnight ?? false,
-				day_of_week: schedule.day_of_week != null ? String(schedule.day_of_week) : '1',
-				end_time: schedule.end_time ?? '17:00',
-				id: schedule.id ?? '',
-				is_enabled: schedule.is_enabled ?? true,
-				key: nextRowKey('dps'),
-				report_id: schedule.report_id ?? reportId,
-				rule_type: schedule.rule_type ?? 'include',
-				start_time: schedule.start_time ?? '09:00',
-				timezone: schedule.timezone ?? 'UTC'
-			})) ?? [];
-
-		return {
-			created_at: source.created_at ?? '',
-			data_pull_interval: normalizeReportDataPullInterval(source.data_pull_interval),
-			dev_eui: normalizedReportDevEui,
-			id: source.id != null ? String(source.id) : '',
-			name: source.name ?? '',
-			report_id: reportId,
-			report_data_processing_schedules: dataProcessingSchedules,
-			report_recipients: recipients.length > 0 ? recipients : [createEmptyRecipient(rootUserId)],
-			report_user_schedule: schedules.length > 0 ? schedules : [createEmptySchedule(rootUserId)],
-			user_id: rootUserId
-		};
-	}
-
-	function buildAlertPointsValueFromReport(source: ReportDto): CwAlertPointsValue {
-		const baseValue = createEmptyAlertPointsValue();
-		const points =
-			source.report_alert_points?.map((point, index) => {
-				const condition =
-					typeof point.operator === 'string' && point.operator.trim().length > 0
-						? mapOperatorToAlertCondition(point.operator)
-						: point.min != null || point.max != null
-							? 'range'
-							: 'equals';
-				const fallbackId = point.id != null ? String(point.id) : nextRowKey(`alert-${index + 1}`);
-
-				return {
-					color: cleanOptional(point.hex_color ?? '')?.toUpperCase() ?? DEFAULT_ALERT_COLOR,
-					condition,
-					id: fallbackId,
-					max: point.max != null ? String(point.max) : '',
-					min: point.min != null ? String(point.min) : '',
-					name: point.name ?? '',
-					value: point.value != null ? String(point.value) : ''
-				};
-			}) ?? [];
-
-		return { ...baseValue, points };
-	}
-
-	return {
-		buildAlertPointsValueFromReport,
-		buildDefaultDraft,
-		buildDraftFromReport,
-		createEmptyDataProcessingSchedule,
-		createEmptyRecipient
-	};
-}
-
-function buildReportAlertPoints(
-	alertPoints: CwAlertPointsValue,
-	defaults: {
-		reportId?: string;
-		userId?: string;
-	}
-): CreateReportAlertPointRequest[] {
-	return alertPoints.points.map((point) => {
-		const alertPayload: CreateReportAlertPointRequest = {
-			data_point_key: DEFAULT_ALERT_DATA_POINT_KEY,
-			name: point.name.trim()
-		};
-
-		if (point.id !== undefined && point.id !== null && point.id !== '') {
-			const parsedId = Number(point.id);
-			if (!isNaN(parsedId)) {
-				alertPayload.id = parsedId;
-			}
-		}
-
-		const alertHexColor = cleanOptional(point.color)?.toUpperCase();
-		const alertMax = parseOptionalNumber(point.max);
-		const alertMin = parseOptionalNumber(point.min);
-		const alertOperator = cleanOptional(mapAlertConditionToOperator(point.condition));
-		const alertValue = parseOptionalNumber(point.value);
-
-		if (alertHexColor) alertPayload.hex_color = alertHexColor;
-		if (alertMax !== undefined) alertPayload.max = alertMax;
-		if (alertMin !== undefined) alertPayload.min = alertMin;
-		if (alertOperator) alertPayload.operator = alertOperator;
-		if (defaults.reportId) alertPayload.report_id = defaults.reportId;
-		if (defaults.userId) alertPayload.user_id = defaults.userId;
-		if (alertValue !== undefined) alertPayload.value = alertValue;
-
-		return alertPayload;
-	});
-}
-
-export function buildRequestPayload(
-	draft: ReportDraft,
-	rootDevEui: string,
-	alertPoints: CwAlertPointsValue,
-	currentUser: CurrentUser
-): CreateReportRequest {
-	const createdAt = cleanOptional(draft.created_at);
-	const id = parseOptionalInteger(draft.id);
-	const reportId = cleanOptional(draft.report_id);
-	const userId = cleanOptional(draft.user_id) ?? currentUser?.id ?? undefined;
-	const devEui = normalizeDevEui(rootDevEui);
-	const dataPullInterval = parseReportDataPullInterval(draft.data_pull_interval);
-
-	const reportUserSchedule: CreateReportUserScheduleRequest[] = draft.report_user_schedule.map(
-		(schedule) => {
-			const schedulePayload: CreateReportUserScheduleRequest = {
-				dev_eui: normalizeDevEui(schedule.dev_eui) || devEui,
-				end_of_day: schedule.end_of_day,
-				end_of_week: schedule.end_of_week,
-				is_active: schedule.is_active
-			};
-
-			const scheduleCreatedAt = cleanOptional(schedule.created_at);
-			const scheduleId = parseOptionalInteger(schedule.id);
-			const scheduleReportId = cleanOptional(schedule.report_id) ?? reportId;
-			const scheduleRowId = parseOptionalInteger(schedule.report_user_schedule_id);
-			const scheduleUserId = cleanOptional(schedule.user_id) ?? userId;
-
-			if (scheduleCreatedAt) schedulePayload.created_at = scheduleCreatedAt;
-			if (scheduleId !== undefined) schedulePayload.id = scheduleId;
-			if (scheduleReportId) schedulePayload.report_id = scheduleReportId;
-			if (scheduleRowId !== undefined) schedulePayload.report_user_schedule_id = scheduleRowId;
-			if (scheduleUserId) schedulePayload.user_id = scheduleUserId;
-
-			return schedulePayload;
-		}
-	);
-
-	const reportAlertPoints = buildReportAlertPoints(alertPoints, { reportId, userId });
-
-	const reportRecipients: CreateReportRecipientRequest[] = draft.report_recipients.map(
-		(recipient) => {
-			const recipientPayload: CreateReportRecipientRequest = {
-				communication_method: parseOptionalInteger(recipient.communication_method) ?? 1
-			};
-
-			const recipientCreatedAt = cleanOptional(recipient.created_at);
-			const recipientEmail = cleanOptional(recipient.email);
-			const recipientId = parseOptionalInteger(recipient.id);
-			const recipientName = cleanOptional(recipient.name);
-			const recipientReportId = cleanOptional(recipient.report_id) ?? reportId;
-			const recipientUserId = cleanOptional(recipient.user_id) ?? userId;
-
-			if (recipientCreatedAt) recipientPayload.created_at = recipientCreatedAt;
-			if (recipientEmail) recipientPayload.email = recipientEmail;
-			if (recipientId !== undefined) recipientPayload.id = recipientId;
-			if (recipientName) recipientPayload.name = recipientName;
-			if (recipientReportId) recipientPayload.report_id = recipientReportId;
-			if (recipientUserId) recipientPayload.user_id = recipientUserId;
-
-			return recipientPayload;
-		}
-	);
-
-	const reportDataProcessingSchedules: CreateReportDataProcessingScheduleRequest[] =
-		draft.report_data_processing_schedules
-			.filter((schedule) => schedule.day_of_week && schedule.start_time && schedule.end_time)
-			.map((schedule) => {
-				const entry: CreateReportDataProcessingScheduleRequest = {
-					day_of_week: parseInt(schedule.day_of_week, 10),
-					start_time: schedule.start_time,
-					end_time: schedule.end_time
-				};
-
-				if (schedule.crosses_midnight !== undefined) {
-					entry.crosses_midnight = schedule.crosses_midnight;
-				}
-				if (schedule.id) entry.id = schedule.id;
-				entry.is_enabled = schedule.is_enabled;
-				if (schedule.report_id) entry.report_id = schedule.report_id;
-				if (schedule.rule_type) entry.rule_type = schedule.rule_type;
-				if (schedule.timezone) entry.timezone = schedule.timezone;
-
-				return entry;
-			});
-
-	const payload: CreateReportRequest = {
-		dev_eui: devEui,
-		name: draft.name.trim(),
-		report_alert_points: reportAlertPoints,
-		report_data_processing_schedules: reportDataProcessingSchedules,
-		report_recipients: reportRecipients,
-		report_user_schedule: reportUserSchedule
-	};
-
-	if (createdAt) payload.created_at = createdAt;
-	if (dataPullInterval !== undefined) payload.data_pull_interval = dataPullInterval;
-	if (id !== undefined) payload.id = id;
-	if (reportId) payload.report_id = reportId;
-	if (userId) payload.user_id = userId;
-
-	return payload;
-}
-
-function buildAlertValidationIssues(alertPoints: CwAlertPointsValue): string[] {
-	const issues: string[] = [];
-
-	alertPoints.points.forEach((point, index) => {
-		const rowIndex = String(index + 1);
-
-		if (!point.name.trim()) {
-			issues.push(m.reports_create_validation_alert_name({ index: rowIndex }));
-		}
-
-		if (point.condition === 'range') {
-			const min = parseOptionalNumber(point.min);
-			const max = parseOptionalNumber(point.max);
-
-			if (min === undefined || max === undefined) {
-				issues.push(m.reports_create_validation_alert_range_required({ index: rowIndex }));
-			} else if (min > max) {
-				issues.push(m.reports_create_validation_alert_range_order({ index: rowIndex }));
-			}
-		} else if (parseOptionalNumber(point.value) === undefined) {
-			issues.push(m.reports_create_validation_alert_value({ index: rowIndex }));
-		}
-
-		const hexColor = cleanOptional(point.color);
-		if (hexColor && !/^#[0-9a-fA-F]{6}$/.test(hexColor)) {
-			issues.push(m.reports_create_validation_alert_hex({ index: rowIndex }));
-		}
-	});
-
-	return issues;
-}
-
-export function buildValidationIssues(
-	draft: ReportDraft,
-	rootDevEui: string,
-	alertPoints: CwAlertPointsValue,
-	currentUser: CurrentUser
-): string[] {
-	const issues: string[] = [];
-	const normalizedRootDevEui = normalizeDevEui(rootDevEui);
-	const rootUserId = cleanOptional(draft.user_id) ?? currentUser?.id ?? undefined;
-
-	if (!draft.name.trim()) {
-		issues.push(m.reports_create_validation_report_name_required());
-	}
-
-	if (normalizedRootDevEui.length !== 16) {
-		issues.push(m.reports_create_validation_dev_eui_length());
-	}
-
-	draft.report_user_schedule.forEach((schedule, index) => {
-		const scheduleDevEui = normalizeDevEui(schedule.dev_eui) || normalizedRootDevEui;
-		const rowIndex = String(index + 1);
-
-		if (scheduleDevEui.length !== 16) {
-			issues.push(m.reports_create_validation_schedule_dev_eui({ index: rowIndex }));
-		}
-
-		if (schedule.is_active && !schedule.end_of_week && !schedule.end_of_day) {
-			issues.push(m.reports_create_validation_schedule_cadence({ index: rowIndex }));
-		}
-	});
-
-	issues.push(...buildAlertValidationIssues(alertPoints));
-
-	draft.report_recipients.forEach((recipient, index) => {
-		const rowIndex = String(index + 1);
-		const communicationMethod = parseOptionalInteger(recipient.communication_method);
-		const email = cleanOptional(recipient.email);
-		const userId = cleanOptional(recipient.user_id) ?? rootUserId;
-
-		if (!communicationMethod) {
-			issues.push(m.reports_create_validation_recipient_method({ index: rowIndex }));
-		}
-
-		if (!email && !userId) {
-			issues.push(m.reports_create_validation_recipient_destination({ index: rowIndex }));
-		}
-
-		if (email && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
-			issues.push(m.reports_create_validation_recipient_email({ index: rowIndex }));
-		}
-	});
-
-	return issues;
-}
diff --git a/src/routes/reports/[report_id]/edit/report-form.types.ts b/src/routes/reports/[report_id]/edit/report-form.types.ts
deleted file mode 100644
index a95e6b7c..00000000
--- a/src/routes/reports/[report_id]/edit/report-form.types.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-export type SelectOption = {
-	disabled?: boolean;
-	label: string;
-	value: string;
-};
-
-export type ScheduleDraft = {
-	created_at: string;
-	dev_eui: string;
-	end_of_day: boolean;
-	end_of_week: boolean;
-	id: string;
-	is_active: boolean;
-	key: string;
-	report_id: string;
-	report_user_schedule_id: string;
-	user_id: string;
-};
-
-export type RecipientDraft = {
-	communication_method: string;
-	created_at: string;
-	email: string;
-	id: string;
-	key: string;
-	name: string;
-	report_id: string;
-	user_id: string;
-};
-
-export type DataProcessingScheduleDraft = {
-	crosses_midnight: boolean;
-	day_of_week: string;
-	end_time: string;
-	id: string;
-	is_enabled: boolean;
-	key: string;
-	report_id: string;
-	rule_type: string;
-	start_time: string;
-	timezone: string;
-};
-
-export type ReportDraft = {
-	created_at: string;
-	data_pull_interval: string;
-	dev_eui: string;
-	id: string;
-	name: string;
-	report_id: string;
-	report_data_processing_schedules: DataProcessingScheduleDraft[];
-	report_recipients: RecipientDraft[];
-	report_user_schedule: ScheduleDraft[];
-	user_id: string;
-};
diff --git a/src/routes/reports-new/alert-points-editor-text.ts b/src/routes/reports/alert-points-editor-text.ts
similarity index 100%
rename from src/routes/reports-new/alert-points-editor-text.ts
rename to src/routes/reports/alert-points-editor-text.ts
diff --git a/src/routes/reports-new/create/+page.server.ts b/src/routes/reports/create/+page.server.ts
similarity index 100%
rename from src/routes/reports-new/create/+page.server.ts
rename to src/routes/reports/create/+page.server.ts
diff --git a/src/routes/reports-new/create/+page.svelte b/src/routes/reports/create/+page.svelte
similarity index 97%
rename from src/routes/reports-new/create/+page.svelte
rename to src/routes/reports/create/+page.svelte
index 6a40dc64..22ae633b 100644
--- a/src/routes/reports-new/create/+page.svelte
+++ b/src/routes/reports/create/+page.svelte
@@ -15,7 +15,7 @@
 </svelte:head>
 
 <AppPage width="lg">
-	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/reports-new'))}>
+	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/reports'))}>
 		&larr; {m.action_back()}
 	</CwButton>
 
diff --git a/src/routes/reports-new/data-pull-interval.ts b/src/routes/reports/data-pull-interval.ts
similarity index 100%
rename from src/routes/reports-new/data-pull-interval.ts
rename to src/routes/reports/data-pull-interval.ts
diff --git a/src/routes/reports-new/edit/[id]/+page.server.ts b/src/routes/reports/edit/[id]/+page.server.ts
similarity index 100%
rename from src/routes/reports-new/edit/[id]/+page.server.ts
rename to src/routes/reports/edit/[id]/+page.server.ts
diff --git a/src/routes/reports-new/edit/[id]/+page.svelte b/src/routes/reports/edit/[id]/+page.svelte
similarity index 98%
rename from src/routes/reports-new/edit/[id]/+page.svelte
rename to src/routes/reports/edit/[id]/+page.svelte
index 3d0b5132..d877a720 100644
--- a/src/routes/reports-new/edit/[id]/+page.svelte
+++ b/src/routes/reports/edit/[id]/+page.svelte
@@ -16,7 +16,7 @@
 </svelte:head>
 
 <AppPage width="lg">
-	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/reports-new'))}>
+	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/reports'))}>
 		&larr; {m.action_back()}
 	</CwButton>
 
diff --git a/src/routes/reports/report-row.ts b/src/routes/reports/report-row.ts
deleted file mode 100644
index bb80a002..00000000
--- a/src/routes/reports/report-row.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import type { ReportDto } from '$lib/api/api.dtos';
-
-export type ReportDeviceRelations = {
-	cw_devices?: {
-		name?: string | null;
-		cw_device_owners?: Array<{
-			user_id?: string | null;
-			permission_level?: number | null;
-		}> | null;
-		cw_locations?: {
-			name?: string | null;
-			location_id?: string | number | null;
-		} | null;
-	} | null;
-};
-
-export type ReportRow = ReportDto &
-	ReportDeviceRelations & {
-		device_name: string;
-		location_name: string;
-		permission_level: number | null;
-	};
diff --git a/src/routes/reports-new/report-template-form.ts b/src/routes/reports/report-template-form.ts
similarity index 100%
rename from src/routes/reports-new/report-template-form.ts
rename to src/routes/reports/report-template-form.ts
diff --git a/src/routes/rules-new/+page.svelte b/src/routes/rules-new/+page.svelte
deleted file mode 100644
index 30650630..00000000
--- a/src/routes/rules-new/+page.svelte
+++ /dev/null
@@ -1,254 +0,0 @@
-<script lang="ts">
-	import { goto } from '$app/navigation';
-	import { page } from '$app/state';
-	import { backHref } from '$lib/navigation/backTo';
-	import { resolve } from '$app/paths';
-	import { readApiErrorMessage } from '$lib/api/api-error';
-	import { ApiService } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import Icon from '$lib/components/Icon.svelte';
-	import { AppPage } from '$lib/components/layout';
-	import type { RuleTemplateDto } from '$lib/rules-new/rule-template.types';
-	import { getRuleSubjectOptions } from '$lib/i18n/options';
-	import {
-		CwButton,
-		CwCard,
-		CwChip,
-		CwDataTable,
-		type CwColumnDef,
-		type CwTableQuery,
-		type CwTableResult
-	} from '@cropwatchdevelopment/cwui';
-	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import { m } from '$lib/paraglide/messages.js';
-	import ADD_ICON from '$lib/images/icons/add.svg';
-	import EDIT_ICON from '$lib/images/icons/edit.svg';
-	import DeleteRuleTemplateDialog from './DeleteRuleTemplateDialog.svelte';
-	import ViewRuleAlertHistory from './ViewRuleAlertHistory.svelte';
-
-	type RuleTemplateRow = RuleTemplateDto & {
-		statusLabel: string;
-		locationName: string;
-		assignmentSummary: string;
-		criteriaSummary: string;
-		actionSummary: string;
-		createdAtLabel: string;
-		triggeredCount: number;
-	};
-
-	const SUBJECT_OPTIONS = getRuleSubjectOptions();
-	const columns: CwColumnDef<RuleTemplateRow>[] = [
-		{ key: 'name', header: m.common_name(), sortable: true },
-		// { key: 'statusLabel', header: m.rules_new_status(), sortable: true },
-		{ key: 'assignmentSummary', header: m.rules_new_assigned_devices() },
-		// { key: 'locationName', header: m.nav_locations(), sortable: true },
-		{ key: 'criteriaSummary', header: m.rules_conditions() },
-		{ key: 'actionSummary', header: m.rules_new_actions() },
-		// { key: 'triggeredCount', header: m.rules_new_triggered_devices(), sortable: true },
-		{ key: 'createdAtLabel', header: m.common_created(), sortable: true }
-	];
-
-	let loading = $state(true);
-	let deletedTemplateIds = $state<number[]>([]);
-	let tableKey = $derived(deletedTemplateIds.join(','));
-	let app = getAppContext();
-
-	async function loadData(query: CwTableQuery): Promise<CwTableResult<RuleTemplateRow>> {
-		try {
-			const api = new ApiService({ authToken: app.accessToken });
-			const templates = await api.getRuleTemplates(
-				{ search: query.search?.trim() || undefined },
-				{ signal: query.signal }
-			);
-			const deletedIds = new Set(deletedTemplateIds);
-			let rows = templates.filter((template) => !deletedIds.has(template.id)).map(toRow);
-
-			if (query.sort) {
-				rows = sortRows(rows, query.sort.column, query.sort.direction);
-			}
-
-			const total = rows.length;
-			const skip = (query.page - 1) * query.pageSize;
-			rows = rows.slice(skip, skip + query.pageSize);
-
-			return { rows, total };
-		} catch (error) {
-			throw new Error(readApiErrorMessage(error, m.rules_new_load_failed()));
-		} finally {
-			loading = false;
-		}
-	}
-
-	function handleDeleted(templateId: number) {
-		if (deletedTemplateIds.includes(templateId)) return;
-		deletedTemplateIds = [...deletedTemplateIds, templateId];
-	}
-
-	function toRow(template: RuleTemplateDto): RuleTemplateRow {
-		const triggeredCount = template.assignments.filter(
-			(assignment) => assignment.state?.isTriggered
-		).length;
-
-		return {
-			...template,
-			statusLabel: template.isActive ? m.rules_new_active() : m.rules_new_inactive(),
-			locationName: summarizeLocations(template),
-			assignmentSummary: summarizeAssignments(template),
-			criteriaSummary: summarizeCriteria(template),
-			actionSummary: summarizeActions(template),
-			createdAtLabel: template.createdAt
-				? new Date(template.createdAt).toLocaleString()
-				: m.common_not_available(),
-			triggeredCount
-		};
-	}
-
-	function summarizeLocations(template: RuleTemplateDto): string {
-		const names = template.assignments
-			.map((assignment) => assignment.locationName)
-			.filter((name): name is string => !!name && name.trim().length > 0);
-		const unique = [...new Set(names)];
-		if (unique.length === 0) return m.rules_new_unknown_location();
-		return unique.length === 1 ? unique[0] : unique.join(', ');
-	}
-
-	function summarizeAssignments(template: RuleTemplateDto): string {
-		if (template.assignments.length === 0) return m.rules_new_no_assignments();
-
-		const labels = template.assignments.map((assignment) =>
-			assignment.deviceName ? `${assignment.deviceName} (${assignment.devEui})` : assignment.devEui
-		);
-
-		return summarizeList(labels);
-	}
-
-	function summarizeCriteria(template: RuleTemplateDto): string {
-		if (template.criteria.length === 0) return m.common_not_available();
-
-		return summarizeList(
-			template.criteria.map((criterion) => {
-				const subjectLabel =
-					SUBJECT_OPTIONS.find((option) => option.value === criterion.subject)?.label ??
-					criterion.subject;
-				return `${subjectLabel} ${criterion.operator} ${criterion.triggerValue}`;
-			})
-		);
-	}
-
-	function summarizeActions(template: RuleTemplateDto): string {
-		if (template.actions.length === 0) return m.common_not_available();
-
-		return summarizeList(
-			template.actions.map((action) => {
-				return action.actionTypeName ?? action.actionTypeValue ?? String(action.actionType);
-			})
-		);
-	}
-
-	function summarizeList(items: string[]): string {
-		const visible = items.slice(0, 2).join(', ');
-		const remaining = items.length - 2;
-		return remaining > 0
-			? m.rules_new_summary_more({ summary: visible, count: String(remaining) })
-			: visible;
-	}
-
-	function sortRows(
-		rows: RuleTemplateRow[],
-		column: string,
-		direction: 'asc' | 'desc'
-	): RuleTemplateRow[] {
-		const dir = direction === 'asc' ? 1 : -1;
-
-		return [...rows].sort((a, b) => {
-			const left = (a as unknown as Record<string, unknown>)[column];
-			const right = (b as unknown as Record<string, unknown>)[column];
-
-			if (typeof left === 'number' && typeof right === 'number') {
-				return (left - right) * dir;
-			}
-
-			return String(left ?? '').localeCompare(String(right ?? '')) * dir;
-		});
-	}
-</script>
-
-<svelte:head>
-	<title>{m.rules_new_page_title()}</title>
-</svelte:head>
-
-<AppPage>
-	<CwButton variant="secondary" onclick={() => goto(backHref(page.url, resolve('/')))}>
-		&larr; {m.action_back_to_dashboard()}
-	</CwButton>
-
-	<CwCard title={m.rules_new_configured_templates()}>
-		{#key tableKey}
-			<CwDataTable
-				labels={cwDataTableLabels()}
-				{columns}
-				{loadData}
-				{loading}
-				groupBy="locationName"
-				rowActionsHeader={m.common_actions()}
-				rowKey="id"
-			>
-				{#snippet cell(
-					row: RuleTemplateRow,
-					col: CwColumnDef<RuleTemplateRow>,
-					defaultValue: string
-				)}
-					{#if col.key === 'statusLabel'}
-						<CwChip
-							label={row.statusLabel}
-							tone={row.isActive ? 'success' : 'warning'}
-							variant="soft"
-							size="sm"
-						/>
-					{:else if col.key === 'triggeredCount'}
-						<CwChip
-							label={String(row.triggeredCount)}
-							tone={row.triggeredCount > 0 ? 'danger' : 'secondary'}
-							variant="soft"
-							size="sm"
-						/>
-					{:else}
-						{defaultValue}
-					{/if}
-				{/snippet}
-
-				{#snippet rowActions(row: RuleTemplateRow)}
-					<div class="rules-new-page__actions">
-						<CwButton
-							variant="secondary"
-							size="md"
-							onclick={() => goto(resolve('/rules-new/edit/[id]', { id: String(row.id) }))}
-						>
-							<Icon src={EDIT_ICON} alt={m.action_edit()} />
-						</CwButton>
-						<ViewRuleAlertHistory templateId={row.id} ruleName={row.name} />
-						<DeleteRuleTemplateDialog
-							templateId={row.id}
-							ruleName={row.name}
-							onDeleted={handleDeleted}
-						/>
-					</div>
-				{/snippet}
-
-				{#snippet toolbarActions()}
-					<CwButton variant="primary" onclick={() => goto(resolve('/rules-new/create'))}>
-						<Icon src={ADD_ICON} alt={m.rules_new_create_template()} />
-					</CwButton>
-				{/snippet}
-			</CwDataTable>
-		{/key}
-	</CwCard>
-</AppPage>
-
-<style>
-	.rules-new-page__actions {
-		display: flex;
-		justify-content: flex-end;
-		gap: var(--cw-space-2);
-	}
-</style>
diff --git a/src/routes/rules-new/[...path]/+page.server.ts b/src/routes/rules-new/[...path]/+page.server.ts
new file mode 100644
index 00000000..b67205e7
--- /dev/null
+++ b/src/routes/rules-new/[...path]/+page.server.ts
@@ -0,0 +1,8 @@
+import { redirect } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types';
+
+// The template-based rules pages took over /rules; keep old bookmarks working.
+export const load: PageServerLoad = ({ params }) => {
+	const suffix = params.path ? `/${params.path}` : '';
+	redirect(301, `/rules${suffix}`);
+};
diff --git a/src/routes/rules-new/create/+page.server.ts b/src/routes/rules-new/create/+page.server.ts
deleted file mode 100644
index 620a8be4..00000000
--- a/src/routes/rules-new/create/+page.server.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { ApiService } from '$lib/api/api.service';
-import type { RuleFormContextDto } from '$lib/api/api.dtos';
-import type { PageServerLoad } from './$types';
-
-const EMPTY_CONTEXT: RuleFormContextDto = {
-	devices: [],
-	locations: [],
-	actionTypes: [],
-	template: null
-};
-
-export const load: PageServerLoad = async ({ locals, fetch, url }) => {
-	const authToken = locals.jwtString ?? null;
-	const devEui = url.searchParams.get('dev_eui') ?? null;
-
-	if (!authToken) {
-		return { context: EMPTY_CONTEXT, authToken, devEui };
-	}
-
-	const api = new ApiService({ fetchFn: fetch, authToken });
-	const context = await api.getRuleFormContext().catch(() => EMPTY_CONTEXT);
-
-	return { context, authToken, devEui };
-};
diff --git a/src/routes/rules-new/create/+page.svelte b/src/routes/rules-new/create/+page.svelte
deleted file mode 100644
index ac0d5abb..00000000
--- a/src/routes/rules-new/create/+page.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script lang="ts">
-	import { goto } from '$app/navigation';
-	import { resolve } from '$app/paths';
-	import { AppPage } from '$lib/components/layout';
-	import { CwButton } from '@cropwatchdevelopment/cwui';
-	import { m } from '$lib/paraglide/messages.js';
-	import type { PageProps } from './$types';
-	import RuleTemplateForm from '../RuleTemplateForm.svelte';
-
-	let { data }: PageProps = $props();
-</script>
-
-<svelte:head>
-	<title>{m.rules_new_create_page_title()}</title>
-</svelte:head>
-
-<AppPage width="lg">
-	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/rules-new'))}>
-		&larr; {m.action_back()}
-	</CwButton>
-
-	<div class="rules-new-create__header">
-		<h1>{m.rules_new_create_template()}</h1>
-	</div>
-
-	<RuleTemplateForm
-		mode="create"
-		context={data.context}
-		authToken={data.authToken}
-		preselectedDevEui={data.devEui}
-	/>
-</AppPage>
-
-<style>
-	.rules-new-create__header h1 {
-		margin: 0;
-		font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
-		font-weight: var(--cw-font-semibold);
-	}
-</style>
diff --git a/src/routes/rules-new/edit/[id]/+page.server.ts b/src/routes/rules-new/edit/[id]/+page.server.ts
deleted file mode 100644
index a52f39fe..00000000
--- a/src/routes/rules-new/edit/[id]/+page.server.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { ApiService, ApiServiceError } from '$lib/api/api.service';
-import type { RuleFormContextDto } from '$lib/api/api.dtos';
-import { m } from '$lib/paraglide/messages.js';
-import { error } from '@sveltejs/kit';
-import type { PageServerLoad } from './$types';
-
-export const load: PageServerLoad = async ({ locals, fetch, params }) => {
-	const authToken = locals.jwtString ?? null;
-	const userId = locals.jwt?.sub ?? null;
-	const templateId = Number(params.id);
-
-	if (!authToken || !userId) {
-		error(401, m.error_unauthorized_title());
-	}
-
-	if (!Number.isInteger(templateId) || templateId <= 0) {
-		error(400, m.rules_new_invalid_template_id());
-	}
-
-	const api = new ApiService({ fetchFn: fetch, authToken });
-	let context: RuleFormContextDto;
-	try {
-		context = await api.getRuleFormContext(templateId);
-	} catch (loadError) {
-		if (loadError instanceof ApiServiceError && loadError.status === 404) {
-			error(404, m.rules_new_rule_template_not_found());
-		}
-		console.error('Failed to load rule template:', loadError);
-		error(500, m.rules_new_load_failed());
-	}
-
-	if (!context.template) {
-		error(404, m.rules_new_rule_template_not_found());
-	}
-
-	return { context, authToken };
-};
diff --git a/src/routes/rules-new/edit/[id]/+page.svelte b/src/routes/rules-new/edit/[id]/+page.svelte
deleted file mode 100644
index 49253dab..00000000
--- a/src/routes/rules-new/edit/[id]/+page.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script lang="ts">
-	import { goto } from '$app/navigation';
-	import { resolve } from '$app/paths';
-	import { AppPage } from '$lib/components/layout';
-	import { CwButton, CwChip } from '@cropwatchdevelopment/cwui';
-	import { m } from '$lib/paraglide/messages.js';
-	import type { PageProps } from './$types';
-	import RuleTemplateForm from '../../RuleTemplateForm.svelte';
-
-	let { data }: PageProps = $props();
-	const templateId = (() => data.context.template?.id ?? 0)();
-</script>
-
-<svelte:head>
-	<title>{m.rules_new_edit_page_title()}</title>
-</svelte:head>
-
-<AppPage width="lg">
-	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/rules-new'))}>
-		&larr; {m.action_back()}
-	</CwButton>
-
-	<div class="rules-new-edit__header">
-		<h1>{m.rules_new_edit_template()}</h1>
-		<CwChip
-			label={`${m.rules_new_template_id()}: ${templateId}`}
-			tone="info"
-			variant="outline"
-			size="sm"
-		/>
-	</div>
-
-	<RuleTemplateForm mode="edit" context={data.context} authToken={data.authToken} />
-</AppPage>
-
-<style>
-	.rules-new-edit__header {
-		display: flex;
-		align-items: center;
-		flex-wrap: wrap;
-		gap: var(--cw-space-3);
-	}
-
-	.rules-new-edit__header h1 {
-		margin: 0;
-		font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
-		font-weight: var(--cw-font-semibold);
-	}
-</style>
diff --git a/src/routes/rules/+page.server.ts b/src/routes/rules/+page.server.ts
deleted file mode 100644
index 59c27423..00000000
--- a/src/routes/rules/+page.server.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import type { PageServerLoad } from './$types';
-
-// The rules list page uses CwDataTable with a client-side loadData callback that
-// fetches, transforms, and paginates rules on demand. Pre-fetching here would
-// duplicate that work and be thrown away immediately. The root layout supplies
-// `authToken` and `session` to every route via layout data inheritance.
-export const load: PageServerLoad = async () => {
-	return {};
-};
diff --git a/src/routes/rules/+page.svelte b/src/routes/rules/+page.svelte
index c4aee119..af1c3a66 100644
--- a/src/routes/rules/+page.svelte
+++ b/src/routes/rules/+page.svelte
@@ -1,121 +1,180 @@
 <script lang="ts">
+	import { goto } from '$app/navigation';
+	import { page } from '$app/state';
+	import { backHref } from '$lib/navigation/backTo';
+	import { resolve } from '$app/paths';
+	import { readApiErrorMessage } from '$lib/api/api-error';
+	import { ApiService } from '$lib/api/api.service';
+	import { getAppContext } from '$lib/appContext.svelte';
 	import Icon from '$lib/components/Icon.svelte';
 	import { AppPage } from '$lib/components/layout';
+	import type { RuleTemplateDto } from '$lib/rules-new/rule-template.types';
+	import { getRuleSubjectOptions } from '$lib/i18n/options';
 	import {
 		CwButton,
 		CwCard,
+		CwChip,
 		CwDataTable,
 		type CwColumnDef,
 		type CwTableQuery,
 		type CwTableResult
 	} from '@cropwatchdevelopment/cwui';
 	import { cwDataTableLabels } from '$lib/i18n/cwuiLabels';
-	import { goto } from '$app/navigation';
-	import { page } from '$app/state';
-	import { backHref } from '$lib/navigation/backTo';
-	import { resolve } from '$app/paths';
-	import type { RulesDto } from '$lib/interfaces/rule.interface';
-	import EDIT_ICON from '$lib/images/icons/edit.svg';
-	import ADD_ICON from '$lib/images/icons/add.svg';
 	import { m } from '$lib/paraglide/messages.js';
-	import DeleteRuleDialog from './DeleteRuleDialog.svelte';
-	import ViewRuleDialog from './ViewRuleDialog.svelte';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import { ApiService } from '$lib/api/api.service';
+	import ADD_ICON from '$lib/images/icons/add.svg';
+	import EDIT_ICON from '$lib/images/icons/edit.svg';
+	import DeleteRuleTemplateDialog from './DeleteRuleTemplateDialog.svelte';
+	import ViewRuleAlertHistory from './ViewRuleAlertHistory.svelte';
 
-	type RuleRow = RulesDto & {
-		device_name: string;
-		location_name: string;
-		permission_level: number | null;
+	type RuleTemplateRow = RuleTemplateDto & {
+		statusLabel: string;
+		locationName: string;
+		assignmentSummary: string;
+		criteriaSummary: string;
+		actionSummary: string;
+		createdAtLabel: string;
+		triggeredCount: number;
 	};
 
-	let loading = $state(false);
-	let deletedRuleGroupIds = $state<string[]>([]);
-	let tableKey = $derived(deletedRuleGroupIds.join(','));
-	let app = getAppContext();
-
-	const columns: CwColumnDef<RuleRow>[] = [
+	const SUBJECT_OPTIONS = getRuleSubjectOptions();
+	const columns: CwColumnDef<RuleTemplateRow>[] = [
 		{ key: 'name', header: m.common_name(), sortable: true },
-		{ key: 'device_name', header: 'Device Name' },
-		{ key: 'location_name', header: m.nav_locations() },
-		{ key: 'created_at', header: m.common_created() },
-		{ key: 'last_triggered', header: 'Last Triggered', sortable: true },
-		{ key: 'trigger_count', header: 'Trigger Count', sortable: true }
+		// { key: 'statusLabel', header: m.rules_new_status(), sortable: true },
+		{ key: 'assignmentSummary', header: m.rules_new_assigned_devices() },
+		// { key: 'locationName', header: m.nav_locations(), sortable: true },
+		{ key: 'criteriaSummary', header: m.rules_conditions() },
+		{ key: 'actionSummary', header: m.rules_new_actions() },
+		// { key: 'triggeredCount', header: m.rules_new_triggered_devices(), sortable: true },
+		{ key: 'createdAtLabel', header: m.common_created(), sortable: true }
 	];
 
-	function sortRules(rows: RuleRow[], column: string, direction: 'asc' | 'desc'): RuleRow[] {
-		const dir = direction === 'asc' ? 1 : -1;
-		return [...rows].sort((a, b) => {
-			const aVal = (a as unknown as Record<string, unknown>)[column];
-			const bVal = (b as unknown as Record<string, unknown>)[column];
-			if (aVal == null && bVal == null) return 0;
-			if (aVal == null) return dir;
-			if (bVal == null) return -dir;
-			if (column === 'trigger_count') return (Number(aVal) - Number(bVal)) * dir;
-			return String(aVal).localeCompare(String(bVal)) * dir;
-		});
+	let loading = $state(true);
+	let deletedTemplateIds = $state<number[]>([]);
+	let tableKey = $derived(deletedTemplateIds.join(','));
+	let app = getAppContext();
+
+	async function loadData(query: CwTableQuery): Promise<CwTableResult<RuleTemplateRow>> {
+		try {
+			const api = new ApiService({ authToken: app.accessToken });
+			const templates = await api.getRuleTemplates(
+				{ search: query.search?.trim() || undefined },
+				{ signal: query.signal }
+			);
+			const deletedIds = new Set(deletedTemplateIds);
+			let rows = templates.filter((template) => !deletedIds.has(template.id)).map(toRow);
+
+			if (query.sort) {
+				rows = sortRows(rows, query.sort.column, query.sort.direction);
+			}
+
+			const total = rows.length;
+			const skip = (query.page - 1) * query.pageSize;
+			rows = rows.slice(skip, skip + query.pageSize);
+
+			return { rows, total };
+		} catch (error) {
+			throw new Error(readApiErrorMessage(error, m.rules_new_load_failed()));
+		} finally {
+			loading = false;
+		}
 	}
 
-	async function loadData(query: CwTableQuery): Promise<CwTableResult<RuleRow>> {
-		const search = query.search?.trim() || '';
-		const api = new ApiService({ authToken: app.accessToken });
-		const rules = await api.getRules({ name: search || undefined });
-
-		const deletedIds = new Set(deletedRuleGroupIds);
-		let rows: RuleRow[] = rules
-			.map((rule) => {
-				const deviceRecord =
-					rule.cw_devices && typeof rule.cw_devices === 'object'
-						? (rule.cw_devices as Record<string, unknown>)
-						: null;
-				const deviceOwners = Array.isArray(deviceRecord?.cw_device_owners)
-					? (deviceRecord.cw_device_owners as Array<{
-							user_id?: string | null;
-							permission_level?: number | null;
-						}>)
-					: [];
-				const locationRecord =
-					deviceRecord?.cw_locations && typeof deviceRecord.cw_locations === 'object'
-						? (deviceRecord.cw_locations as Record<string, unknown>)
-						: null;
-
-				return {
-					...rule,
-					device_name:
-						deviceRecord?.name && typeof deviceRecord.name === 'string'
-							? deviceRecord.name
-							: '',
-					location_name:
-						typeof locationRecord?.name === 'string' && locationRecord.name.trim().length > 0
-							? locationRecord.name
-							: '',
-					permission_level:
-						deviceOwners.find((o) => o.user_id === app.session?.sub)?.permission_level ?? null,
-					created_at: new Date(rule.created_at),
-					last_triggered: rule.last_triggered ? new Date(rule.last_triggered) : null
-				} as unknown as RuleRow;
+	function handleDeleted(templateId: number) {
+		if (deletedTemplateIds.includes(templateId)) return;
+		deletedTemplateIds = [...deletedTemplateIds, templateId];
+	}
+
+	function toRow(template: RuleTemplateDto): RuleTemplateRow {
+		const triggeredCount = template.assignments.filter(
+			(assignment) => assignment.state?.isTriggered
+		).length;
+
+		return {
+			...template,
+			statusLabel: template.isActive ? m.rules_new_active() : m.rules_new_inactive(),
+			locationName: summarizeLocations(template),
+			assignmentSummary: summarizeAssignments(template),
+			criteriaSummary: summarizeCriteria(template),
+			actionSummary: summarizeActions(template),
+			createdAtLabel: template.createdAt
+				? new Date(template.createdAt).toLocaleString()
+				: m.common_not_available(),
+			triggeredCount
+		};
+	}
+
+	function summarizeLocations(template: RuleTemplateDto): string {
+		const names = template.assignments
+			.map((assignment) => assignment.locationName)
+			.filter((name): name is string => !!name && name.trim().length > 0);
+		const unique = [...new Set(names)];
+		if (unique.length === 0) return m.rules_new_unknown_location();
+		return unique.length === 1 ? unique[0] : unique.join(', ');
+	}
+
+	function summarizeAssignments(template: RuleTemplateDto): string {
+		if (template.assignments.length === 0) return m.rules_new_no_assignments();
+
+		const labels = template.assignments.map((assignment) =>
+			assignment.deviceName ? `${assignment.deviceName} (${assignment.devEui})` : assignment.devEui
+		);
+
+		return summarizeList(labels);
+	}
+
+	function summarizeCriteria(template: RuleTemplateDto): string {
+		if (template.criteria.length === 0) return m.common_not_available();
+
+		return summarizeList(
+			template.criteria.map((criterion) => {
+				const subjectLabel =
+					SUBJECT_OPTIONS.find((option) => option.value === criterion.subject)?.label ??
+					criterion.subject;
+				return `${subjectLabel} ${criterion.operator} ${criterion.triggerValue}`;
 			})
-			.filter((r) => !deletedIds.has(r.ruleGroupId));
+		);
+	}
 
-		if (query.sort) {
-			rows = sortRules(rows, query.sort.column, query.sort.direction);
-		}
+	function summarizeActions(template: RuleTemplateDto): string {
+		if (template.actions.length === 0) return m.common_not_available();
 
-		const total = rows.length;
-		const skip = (query.page - 1) * query.pageSize;
-		rows = rows.slice(skip, skip + query.pageSize);
+		return summarizeList(
+			template.actions.map((action) => {
+				return action.actionTypeName ?? action.actionTypeValue ?? String(action.actionType);
+			})
+		);
+	}
 
-		return { rows, total };
+	function summarizeList(items: string[]): string {
+		const visible = items.slice(0, 2).join(', ');
+		const remaining = items.length - 2;
+		return remaining > 0
+			? m.rules_new_summary_more({ summary: visible, count: String(remaining) })
+			: visible;
 	}
 
-	function handleRuleDeleted(ruleGroupId: string) {
-		if (deletedRuleGroupIds.includes(ruleGroupId)) return;
-		deletedRuleGroupIds = [...deletedRuleGroupIds, ruleGroupId];
+	function sortRows(
+		rows: RuleTemplateRow[],
+		column: string,
+		direction: 'asc' | 'desc'
+	): RuleTemplateRow[] {
+		const dir = direction === 'asc' ? 1 : -1;
+
+		return [...rows].sort((a, b) => {
+			const left = (a as unknown as Record<string, unknown>)[column];
+			const right = (b as unknown as Record<string, unknown>)[column];
+
+			if (typeof left === 'number' && typeof right === 'number') {
+				return (left - right) * dir;
+			}
+
+			return String(left ?? '').localeCompare(String(right ?? '')) * dir;
+		});
 	}
 </script>
 
 <svelte:head>
-	<title>{m.rules_page_title()}</title>
+	<title>{m.rules_new_page_title()}</title>
 </svelte:head>
 
 <AppPage>
@@ -123,61 +182,73 @@
 		&larr; {m.action_back_to_dashboard()}
 	</CwButton>
 
-	<CwCard title={m.rules_configured_rules()}>
+	<CwCard title={m.rules_new_configured_templates()}>
 		{#key tableKey}
-			<CwDataTable labels={cwDataTableLabels()}
+			<CwDataTable
+				labels={cwDataTableLabels()}
 				{columns}
 				{loadData}
 				{loading}
-				groupBy="device_name"
+				groupBy="locationName"
 				rowActionsHeader={m.common_actions()}
 				rowKey="id"
-				class="w-full"
 			>
-				{#snippet cell(row: RuleRow, col: CwColumnDef<RuleRow>, defaultValue: string)}
-					{#if col.key === 'created_at'}
-						{new Date(row.created_at).toLocaleString()}
-					{:else if col.key === 'last_triggered'}
-						{row.last_triggered
-							? new Date(row.last_triggered).toLocaleString()
-							: m.common_not_available()}
+				{#snippet cell(
+					row: RuleTemplateRow,
+					col: CwColumnDef<RuleTemplateRow>,
+					defaultValue: string
+				)}
+					{#if col.key === 'statusLabel'}
+						<CwChip
+							label={row.statusLabel}
+							tone={row.isActive ? 'success' : 'warning'}
+							variant="soft"
+							size="sm"
+						/>
+					{:else if col.key === 'triggeredCount'}
+						<CwChip
+							label={String(row.triggeredCount)}
+							tone={row.triggeredCount > 0 ? 'danger' : 'secondary'}
+							variant="soft"
+							size="sm"
+						/>
 					{:else}
 						{defaultValue}
 					{/if}
 				{/snippet}
-				{#snippet rowActions(row: RuleRow)}
-					<div class="flex w-full flex-row justify-end gap-2">
-						{#if row.permission_level != null && row.permission_level <= 3}
-							<ViewRuleDialog {row} />
-						{/if}
-						{#if row.permission_level != null && row.permission_level <= 2}
-							<CwButton
-								variant="primary"
-								size="md"
-								onclick={() => goto(resolve('/rules/edit/[id]', { id: String(row.id) }))}
-							>
-								<Icon src={EDIT_ICON} alt={m.action_edit()} />
-							</CwButton>
-							<DeleteRuleDialog
-								ruleGroupId={row.ruleGroupId}
-								ruleName={row.name}
-								onDeleted={handleRuleDeleted}
-							/>
-						{/if}
+
+				{#snippet rowActions(row: RuleTemplateRow)}
+					<div class="rules-new-page__actions">
+						<CwButton
+							variant="secondary"
+							size="md"
+							onclick={() => goto(resolve('/rules/edit/[id]', { id: String(row.id) }))}
+						>
+							<Icon src={EDIT_ICON} alt={m.action_edit()} />
+						</CwButton>
+						<ViewRuleAlertHistory templateId={row.id} ruleName={row.name} />
+						<DeleteRuleTemplateDialog
+							templateId={row.id}
+							ruleName={row.name}
+							onDeleted={handleDeleted}
+						/>
 					</div>
 				{/snippet}
+
 				{#snippet toolbarActions()}
-					<CwButton
-						variant="primary"
-						onclick={() => {
-							goto(resolve('/rules/create'));
-						}}
-					>
-						<Icon src={ADD_ICON} alt={m.rules_create_new_rule()} />
-						{m.rules_create_new_rule()}
+					<CwButton variant="primary" onclick={() => goto(resolve('/rules/create'))}>
+						<Icon src={ADD_ICON} alt={m.rules_new_create_template()} />
 					</CwButton>
 				{/snippet}
 			</CwDataTable>
 		{/key}
 	</CwCard>
 </AppPage>
+
+<style>
+	.rules-new-page__actions {
+		display: flex;
+		justify-content: flex-end;
+		gap: var(--cw-space-2);
+	}
+</style>
diff --git a/src/routes/rules/DeleteRuleDialog.svelte b/src/routes/rules/DeleteRuleDialog.svelte
deleted file mode 100644
index 459502db..00000000
--- a/src/routes/rules/DeleteRuleDialog.svelte
+++ /dev/null
@@ -1,64 +0,0 @@
-<script lang="ts">
-	import Icon from '$lib/components/Icon.svelte';
-	import { CwButton, CwDialog, useCwToast } from '@cropwatchdevelopment/cwui';
-	import BACK_ICON from '$lib/images/icons/back.svg';
-	import { ApiService } from '$lib/api/api.service';
-	import { getAppContext } from '$lib/appContext.svelte';
-	import { m } from '$lib/paraglide/messages.js';
-	import TRASH_ICON from '$lib/images/icons/trash.svg';
-
-	let {
-		ruleGroupId,
-		ruleName,
-		onDeleted
-	}: { ruleGroupId: string; ruleName: string; onDeleted?: (ruleGroupId: string) => void } =
-		$props();
-
-	let app = getAppContext();
-	let open = $state(false);
-	let deleting = $state(false);
-	const toast = useCwToast();
-
-	const handleDelete = async () => {
-		if (deleting) return;
-		deleting = true;
-		try {
-			const api = new ApiService({
-				authToken: app.accessToken
-			});
-			await api.deleteRule(ruleGroupId);
-			onDeleted?.(ruleGroupId);
-			open = false;
-			toast.add({
-				tone: 'success',
-				message: m.rules_delete_success({ name: ruleName })
-			});
-		} catch (error) {
-			toast.add({
-				tone: 'danger',
-				message: m.rules_delete_failed()
-			});
-			deleting = false;
-			return;
-		}
-	};
-</script>
-
-<CwButton variant="danger" size="md" onclick={() => (open = true)}>
-	<Icon src={TRASH_ICON} alt={m.action_delete()} />
-</CwButton>
-
-<CwDialog {open} title={m.rules_delete_rule()} onclose={() => (open = false)}>
-	<p>{m.rules_delete_confirmation({ name: ruleName })}</p>
-	{#snippet actions()}
-		<div class="flex flex-row gap-2">
-			<CwButton variant="secondary" size="md" onclick={() => (open = false)}>
-				<Icon src={BACK_ICON} alt={m.action_cancel()} />
-				{m.action_cancel()}
-			</CwButton>
-			<CwButton variant="danger" size="md" onclick={handleDelete} disabled={deleting}>
-				{m.action_delete()}
-			</CwButton>
-		</div>
-	{/snippet}
-</CwDialog>
diff --git a/src/routes/rules-new/DeleteRuleTemplateDialog.svelte b/src/routes/rules/DeleteRuleTemplateDialog.svelte
similarity index 100%
rename from src/routes/rules-new/DeleteRuleTemplateDialog.svelte
rename to src/routes/rules/DeleteRuleTemplateDialog.svelte
diff --git a/src/routes/rules/RuleForm.svelte b/src/routes/rules/RuleForm.svelte
deleted file mode 100644
index eeb88c86..00000000
--- a/src/routes/rules/RuleForm.svelte
+++ /dev/null
@@ -1,442 +0,0 @@
-<script lang="ts">
-	import { goto } from '$app/navigation';
-	import { resolve } from '$app/paths';
-	import { ApiService } from '$lib/api/api.service';
-	import type { CreateRuleRequest, DeviceDto, RuleDto, UpdateRuleRequest } from '$lib/api/api.dtos';
-	import Icon from '$lib/components/Icon.svelte';
-	import { AppActionRow, AppFormStack, AppNotice, AppPage } from '$lib/components/layout';
-	import SAVE_ICON from '$lib/images/icons/save.svg';
-	import {
-		getRuleNotifierTypeOptions,
-		getRuleOperatorOptions,
-		getRuleSendMethodOptions,
-		getRuleSubjectOptions
-	} from '$lib/i18n/options';
-	import { m } from '$lib/paraglide/messages.js';
-	import {
-		CwButton,
-		CwCard,
-		CwChip,
-		CwDropdown,
-		CwInput,
-		CwSeparator,
-		useCwToast
-	} from '@cropwatchdevelopment/cwui';
-
-	type RuleFormMode = 'create' | 'edit';
-
-	interface CriteriaEntry {
-		id: number;
-		criteriaId: number | null;
-		subject: string;
-		operator: string;
-		triggerValue: string;
-		resetValue: string;
-	}
-
-	interface Props {
-		mode: RuleFormMode;
-		devices: DeviceDto[];
-		authToken?: string | null;
-		initialDevEui?: string | null;
-		rule?: RuleDto | null;
-	}
-
-	let { mode, devices, authToken = null, initialDevEui = null, rule = null }: Props = $props();
-
-	const initialRule = (() => rule)();
-	const startingDevEui = (() => initialDevEui)();
-	let isEdit = $derived(mode === 'edit');
-	const toast = useCwToast();
-
-	const OPERATORS = getRuleOperatorOptions();
-	const NOTIFIER_TYPES = getRuleNotifierTypeOptions();
-	const SEND_METHODS = getRuleSendMethodOptions();
-	const SUBJECT_OPTIONS = getRuleSubjectOptions();
-
-	let ruleName = $state(initialRule?.name ?? '');
-	let actionRecipient = $state(initialRule?.action_recipient ?? '');
-	let notifierType = $state(String(initialRule?.notifier_type ?? 1));
-	let selectedDevEui = $state(initialRule?.dev_eui ?? startingDevEui ?? '');
-	let sendUsing = $state(initialRule?.send_using ?? 'email');
-	let submitting = $state(false);
-
-	const existingCriteria = initialRule?.cw_rule_criteria ?? [];
-	let nextCriteriaId = $state(existingCriteria.length + 1);
-	let criteria = $state<CriteriaEntry[]>(
-		existingCriteria.length > 0
-			? existingCriteria.map((criterion, index) => ({
-					id: index + 1,
-					criteriaId: criterion.id,
-					subject: criterion.subject,
-					operator: criterion.operator,
-					triggerValue: String(criterion.trigger_value),
-					resetValue: criterion.reset_value != null ? String(criterion.reset_value) : ''
-				}))
-			: [createEmptyCriterion()]
-	);
-
-	let deviceLocked = $derived(mode === 'create' && !!startingDevEui);
-	let deviceOptions = $derived(
-		(devices ?? []).map((device) => ({
-			label: device.name ? `${device.name} (${device.dev_eui})` : device.dev_eui,
-			value: device.dev_eui
-		}))
-	);
-	let selectedDeviceName = $derived(
-		(devices ?? []).find((device) => device.dev_eui === selectedDevEui)?.name ?? selectedDevEui
-	);
-	let isFormValid = $derived(
-		ruleName.trim().length > 0 &&
-			actionRecipient.trim().length > 0 &&
-			selectedDevEui.length > 0 &&
-			criteria.every((criterion) => criterion.triggerValue.trim().length > 0)
-	);
-	let criteriaPreview = $derived(
-		criteria.map((criterion) => {
-			const subjectLabel =
-				SUBJECT_OPTIONS.find((subject) => subject.value === criterion.subject)?.label ??
-				criterion.subject;
-			return `${subjectLabel} ${criterion.operator} ${criterion.triggerValue}`;
-		})
-	);
-
-	function createEmptyCriterion(): CriteriaEntry {
-		const criterion = {
-			id: nextCriteriaId,
-			criteriaId: null,
-			subject: 'temperature_c',
-			operator: '>',
-			triggerValue: '',
-			resetValue: ''
-		};
-
-		nextCriteriaId += 1;
-		return criterion;
-	}
-
-	function addCriterion() {
-		criteria = [...criteria, createEmptyCriterion()];
-	}
-
-	function removeCriterion(id: number) {
-		if (criteria.length <= 1) return;
-		criteria = criteria.filter((criterion) => criterion.id !== id);
-	}
-
-	function buildCriteria(ruleGroupId: string) {
-		return criteria.map((criterion) => ({
-			id: criterion.criteriaId ?? 0,
-			subject: criterion.subject,
-			operator: criterion.operator,
-			trigger_value: parseFloat(criterion.triggerValue),
-			reset_value: criterion.resetValue ? parseFloat(criterion.resetValue) : null,
-			ruleGroupId
-		}));
-	}
-
-	async function handleSubmit() {
-		if (!isFormValid || submitting) return;
-
-		submitting = true;
-
-		try {
-			const api = new ApiService({ authToken: authToken ?? undefined });
-			const ruleGroupId = initialRule?.ruleGroupId ?? crypto.randomUUID();
-			const payload: CreateRuleRequest | UpdateRuleRequest = {
-				name: ruleName.trim(),
-				action_recipient: actionRecipient.trim(),
-				notifier_type: parseInt(notifierType, 10),
-				ruleGroupId,
-				dev_eui: selectedDevEui,
-				send_using: sendUsing,
-				cw_rule_criteria: buildCriteria(ruleGroupId)
-			};
-
-			if (isEdit) {
-				if (!initialRule) return;
-				await api.updateRule(initialRule.id, payload);
-			} else {
-				await api.createRule(payload as CreateRuleRequest);
-			}
-
-			toast.add({
-				tone: 'success',
-				message: isEdit
-					? m.rules_updated_success({ name: ruleName })
-					: m.rules_created_success({ name: ruleName }),
-				duration: 4000,
-				dismissible: true
-			});
-
-			goto(resolve('/rules'));
-		} catch (err) {
-			console.error(isEdit ? 'Failed to update rule:' : 'Failed to create rule:', err);
-			toast.add({
-				tone: 'danger',
-				message: isEdit ? m.rules_update_failed() : m.rules_create_failed(),
-				duration: 5000,
-				dismissible: true
-			});
-		} finally {
-			submitting = false;
-		}
-	}
-</script>
-
-<AppPage width="lg" class="rules-page">
-	{#if mode === 'create'}
-		<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/rules'))}>
-			&larr; {m.action_back()}
-		</CwButton>
-	{/if}
-
-	<div class="rules-page__shell">
-		<div class="rules-page__header">
-			{#if isEdit}
-				<CwButton variant="ghost" size="sm" onclick={() => goto(resolve('/rules'))}>
-					{m.action_back()}
-				</CwButton>
-			{/if}
-			<h1 class="rules-page__title">
-				{isEdit ? m.rules_edit_rule() : m.rules_create_new_rule()}
-			</h1>
-			{#if initialRule}
-				<CwChip label={`ID: ${initialRule.id}`} tone="info" variant="outline" size="sm" />
-			{/if}
-		</div>
-
-		<CwCard title={m.rules_step_1_title()}>
-			<AppFormStack padded>
-				<CwInput
-					label={m.rules_rule_name()}
-					placeholder={m.rules_rule_name_placeholder()}
-					bind:value={ruleName}
-					required
-					error={ruleName.length === 0 ? '' : undefined}
-				/>
-
-				<div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
-					{#if isEdit}
-						<CwDropdown
-							label={m.rules_notification_type()}
-							options={NOTIFIER_TYPES}
-							bind:value={notifierType}
-						/>
-						<CwDropdown
-							label={m.rules_send_using()}
-							options={SEND_METHODS}
-							bind:value={sendUsing}
-						/>
-					{:else}
-						<input type="hidden" bind:value={notifierType} />
-						<input type="hidden" bind:value={sendUsing} />
-					{/if}
-				</div>
-
-				<CwInput
-					label={m.rules_recipient()}
-					type="email"
-					placeholder={m.rules_recipient_placeholder()}
-					bind:value={actionRecipient}
-					required
-				>
-					{#snippet leftSlot()}
-						<span class="text-sm opacity-60">📧</span>
-					{/snippet}
-				</CwInput>
-			</AppFormStack>
-		</CwCard>
-
-		<CwCard title={m.rules_step_2_title()}>
-			<AppFormStack padded>
-				{#if deviceOptions.length === 0}
-					<AppNotice tone="neutral">
-						<p>{m.rules_no_devices_available()}</p>
-					</AppNotice>
-				{:else}
-					<CwDropdown
-						label={m.devices_device()}
-						placeholder={m.rules_select_device_placeholder()}
-						options={deviceOptions}
-						bind:value={selectedDevEui}
-						required
-						disabled={deviceLocked}
-					/>
-					{#if deviceLocked}
-						<p class="text-xs opacity-50">{m.rules_device_preselected()}</p>
-					{/if}
-					{#if selectedDevEui}
-						<div class="flex items-center gap-2">
-							<CwChip label={selectedDeviceName} tone="info" variant="soft" />
-							<span class="text-xs opacity-50">{selectedDevEui}</span>
-						</div>
-					{/if}
-				{/if}
-			</AppFormStack>
-		</CwCard>
-
-		<CwCard
-			title={m.rules_step_3_title()}
-			subtitle={mode === 'create' ? m.rules_step_3_subtitle() : undefined}
-		>
-			<AppFormStack padded>
-				{#each criteria as criterion, idx (criterion.id)}
-					<div class="rules-criterion">
-						<div class="rules-criterion__header">
-							<span class="rules-criterion__title">
-								{m.rules_condition_number({ count: String(idx + 1) })}
-							</span>
-							{#if criteria.length > 1}
-								<CwButton variant="danger" size="sm" onclick={() => removeCriterion(criterion.id)}>
-									{m.action_remove()}
-								</CwButton>
-							{/if}
-						</div>
-
-						<div class="grid grid-cols-1 gap-3 sm:grid-cols-3">
-							<CwDropdown
-								label={m.rules_data_field()}
-								options={SUBJECT_OPTIONS}
-								bind:value={criterion.subject}
-							/>
-							<CwDropdown
-								label={m.rules_operator()}
-								options={OPERATORS}
-								bind:value={criterion.operator}
-							/>
-							<CwInput
-								label={m.rules_trigger_value()}
-								type="numeric"
-								placeholder={m.rules_trigger_value_placeholder()}
-								bind:value={criterion.triggerValue}
-								required
-							/>
-						</div>
-
-						<div class="mt-3">
-							<div class="p-2">
-								<CwInput
-									label={m.rules_reset_value()}
-									type="numeric"
-									required={!isEdit}
-									placeholder={isEdit
-										? m.rules_reset_value_optional_placeholder()
-										: m.rules_reset_value_placeholder()}
-									bind:value={criterion.resetValue}
-								/>
-								{#if isEdit}
-									<p class="mt-1 text-xs opacity-50">
-										{m.rules_reset_value_help()}
-									</p>
-								{/if}
-							</div>
-						</div>
-					</div>
-				{/each}
-
-				{#if mode === 'create'}
-					<CwButton variant="secondary" type="button" onclick={addCriterion}>
-						{m.rules_add_another_condition()}
-					</CwButton>
-				{/if}
-			</AppFormStack>
-		</CwCard>
-
-		<CwCard title={isEdit ? m.rules_step_4_review_save_title() : m.rules_step_4_title()}>
-			<AppFormStack padded>
-				{#if isFormValid}
-					<AppNotice title={m.rules_rule_summary()} tone="info">
-						<dl class="grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-sm">
-							<dt class="font-medium opacity-70">{m.common_name()}:</dt>
-							<dd>{ruleName}</dd>
-							<dt class="font-medium opacity-70">{m.devices_device()}:</dt>
-							<dd>{selectedDeviceName}</dd>
-							<dt class="font-medium opacity-70">{m.rules_notify_via()}:</dt>
-							<dd>
-								{NOTIFIER_TYPES.find((notifier) => notifier.value === notifierType)?.label}
-								({sendUsing}) → {actionRecipient}
-							</dd>
-							<dt class="font-medium opacity-70">{m.rules_conditions()}:</dt>
-							<dd>
-								<div class="flex flex-wrap gap-1">
-									{#each criteriaPreview as preview, i (i)}
-										<CwChip label={preview} tone="warning" variant="soft" size="sm" />
-									{/each}
-								</div>
-							</dd>
-						</dl>
-					</AppNotice>
-				{:else}
-					<AppNotice tone="neutral">
-						<p>{m.rules_complete_required_fields()}</p>
-					</AppNotice>
-				{/if}
-
-				<CwSeparator />
-
-				<AppActionRow>
-					<CwButton variant="ghost" onclick={() => goto(resolve('/rules'))} disabled={submitting}>
-						{m.action_cancel()}
-					</CwButton>
-					<CwButton
-						variant="primary"
-						onclick={handleSubmit}
-						disabled={!isFormValid || submitting}
-						loading={submitting}
-					>
-						{#if isEdit}
-							<Icon src={SAVE_ICON} />
-							{submitting ? m.action_saving() : m.action_save_changes()}
-						{:else}
-							{submitting ? m.rules_creating() : m.rules_create_rule()}
-						{/if}
-					</CwButton>
-				</AppActionRow>
-			</AppFormStack>
-		</CwCard>
-	</div>
-</AppPage>
-
-<style>
-	.rules-page__shell {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-4);
-	}
-
-	.rules-page__header {
-		display: flex;
-		align-items: center;
-		gap: var(--cw-space-3);
-		flex-wrap: wrap;
-	}
-
-	.rules-page__title {
-		margin: 0;
-		font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
-		font-weight: var(--cw-font-semibold);
-	}
-
-	.rules-criterion {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-3);
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.rules-criterion__header {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		gap: var(--cw-space-3);
-	}
-
-	.rules-criterion__title {
-		font-size: var(--cw-text-sm);
-		font-weight: var(--cw-font-medium);
-	}
-</style>
diff --git a/src/routes/rules-new/RuleTemplateForm.svelte b/src/routes/rules/RuleTemplateForm.svelte
similarity index 99%
rename from src/routes/rules-new/RuleTemplateForm.svelte
rename to src/routes/rules/RuleTemplateForm.svelte
index d3ec2765..80d69856 100644
--- a/src/routes/rules-new/RuleTemplateForm.svelte
+++ b/src/routes/rules/RuleTemplateForm.svelte
@@ -305,7 +305,7 @@
 				});
 			}
 
-			await goto(resolve('/rules-new'));
+			await goto(resolve('/rules'));
 		} catch (error) {
 			toast.add({
 				tone: 'danger',
@@ -554,7 +554,7 @@
 		<CwSeparator />
 
 		<AppActionRow>
-			<CwButton variant="ghost" onclick={() => goto(resolve('/rules-new'))} disabled={submitting}>
+			<CwButton variant="ghost" onclick={() => goto(resolve('/rules'))} disabled={submitting}>
 				{m.action_cancel()}
 			</CwButton>
 			<CwButton
diff --git a/src/routes/rules-new/RuleTemplateTest.svelte b/src/routes/rules/RuleTemplateTest.svelte
similarity index 100%
rename from src/routes/rules-new/RuleTemplateTest.svelte
rename to src/routes/rules/RuleTemplateTest.svelte
diff --git a/src/routes/rules-new/ViewRuleAlertHistory.svelte b/src/routes/rules/ViewRuleAlertHistory.svelte
similarity index 100%
rename from src/routes/rules-new/ViewRuleAlertHistory.svelte
rename to src/routes/rules/ViewRuleAlertHistory.svelte
diff --git a/src/routes/rules/ViewRuleDialog.svelte b/src/routes/rules/ViewRuleDialog.svelte
deleted file mode 100644
index 7ef8e296..00000000
--- a/src/routes/rules/ViewRuleDialog.svelte
+++ /dev/null
@@ -1,188 +0,0 @@
-<script lang="ts">
-	import Icon from '$lib/components/Icon.svelte';
-	import { AppNotice } from '$lib/components/layout';
-	import { CwButton, CwChip, CwDialog, CwSeparator } from '@cropwatchdevelopment/cwui';
-	import {
-		getRuleNotifierTypeOptions,
-		getRuleSendMethodOptions,
-		getRuleSubjectOptions
-	} from '$lib/i18n/options';
-	import type { RulesDto } from '$lib/interfaces/rule.interface';
-	import { m } from '$lib/paraglide/messages.js';
-	import EYE_ICON from '$lib/images/icons/eye.svg';
-
-	type RuleRow = RulesDto & {
-		location_name?: string;
-		cw_devices?: Record<string, unknown> | null;
-	};
-
-	let { row }: { row: RuleRow } = $props();
-	let open = $state(false);
-
-	const NOTIFIER_TYPES = getRuleNotifierTypeOptions();
-	const SEND_METHODS = getRuleSendMethodOptions();
-	const SUBJECT_OPTIONS = getRuleSubjectOptions();
-
-	let criteriaPreview = $derived(
-		(row.cw_rule_criteria ?? []).map(
-			(criterion) =>
-				`${getCriterionSubjectLabel(criterion.subject)} ${criterion.operator} ${criterion.trigger_value}`
-		)
-	);
-
-	function isRecord(value: unknown): value is Record<string, unknown> {
-		return typeof value === 'object' && value !== null && !Array.isArray(value);
-	}
-
-	function getCriterionSubjectLabel(subject: string) {
-		return SUBJECT_OPTIONS.find((option) => option.value === subject)?.label ?? subject;
-	}
-
-	function getNotifierLabel(notifierType: number) {
-		return (
-			NOTIFIER_TYPES.find((option) => option.value === String(notifierType))?.label ??
-			String(notifierType)
-		);
-	}
-
-	function getSendMethodLabel(sendUsing: string | null | undefined) {
-		if (!sendUsing) return '';
-		return SEND_METHODS.find((option) => option.value === sendUsing)?.label ?? sendUsing;
-	}
-
-	function getNotificationSummary(rule: RuleRow) {
-		const notifier = getNotifierLabel(rule.notifier_type);
-		const sendMethod = getSendMethodLabel(rule.send_using);
-		return sendMethod
-			? `${notifier} (${sendMethod}) → ${rule.action_recipient}`
-			: `${notifier} → ${rule.action_recipient}`;
-	}
-
-	function getDeviceLabel(rule: RuleRow) {
-		const deviceRecord = isRecord(rule.cw_devices) ? rule.cw_devices : null;
-		const deviceName =
-			typeof deviceRecord?.name === 'string' && deviceRecord.name.trim().length > 0
-				? deviceRecord.name
-				: '';
-		const devEui = rule.dev_eui?.trim() ?? '';
-
-		if (deviceName && devEui) return `${deviceName} (${devEui})`;
-		return deviceName || devEui || '-';
-	}
-
-	function getResetValueLabel(resetValue: number | null | undefined) {
-		return resetValue === null || resetValue === undefined ? '-' : String(resetValue);
-	}
-</script>
-
-<CwButton variant="info" size="md" onclick={() => (open = true)}>
-	<Icon src={EYE_ICON} alt={m.action_view()} />
-</CwButton>
-
-<CwDialog bind:open title={m.rules_rule_summary()} class="w-full max-w-2xl">
-	<div class="rule-dialog">
-		<AppNotice title={m.rules_rule_summary()} tone="info">
-			<dl class="grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 text-sm">
-				<dt class="font-medium opacity-70">{m.common_name()}:</dt>
-				<dd>{row.name}</dd>
-
-				<dt class="font-medium opacity-70">{m.devices_device()}:</dt>
-				<dd>{getDeviceLabel(row)}</dd>
-
-				<dt class="font-medium opacity-70">{m.rules_trigger_count()}:</dt>
-				<dd>{row.trigger_count}</dd>
-
-				<dt class="font-medium opacity-70">{m.rules_notify_via()}:</dt>
-				<dd>{getNotificationSummary(row)}</dd>
-
-				<dt class="font-medium opacity-70">{m.rules_conditions()}:</dt>
-				<dd>
-					{#if criteriaPreview.length > 0}
-						<div class="flex flex-wrap gap-1">
-							{#each criteriaPreview as preview, i (i)}
-								<CwChip label={preview} tone="warning" variant="soft" size="sm" />
-							{/each}
-						</div>
-					{:else}
-						<span class="opacity-60">-</span>
-					{/if}
-				</dd>
-			</dl>
-		</AppNotice>
-
-		{#if row.cw_rule_criteria?.length}
-			<CwSeparator />
-
-			<div class="rule-dialog__criteria">
-				{#each row.cw_rule_criteria as criterion, idx (criterion.id)}
-					<div class="rule-dialog__criterion">
-						<div class="rule-dialog__criterion-header">
-							<span class="rule-dialog__criterion-title">
-								{m.rules_condition_number({ count: String(idx + 1) })}
-							</span>
-						</div>
-
-						<dl class="grid grid-cols-1 gap-3 text-sm sm:grid-cols-3">
-							<div>
-								<dt class="mb-1 font-medium opacity-70">{m.rules_data_field()}:</dt>
-								<dd>{getCriterionSubjectLabel(criterion.subject)}</dd>
-							</div>
-
-							<div>
-								<dt class="mb-1 font-medium opacity-70">{m.rules_operator()}:</dt>
-								<dd>{criterion.operator}</dd>
-							</div>
-
-							<div>
-								<dt class="mb-1 font-medium opacity-70">{m.rules_trigger_value()}:</dt>
-								<dd>{criterion.trigger_value}</dd>
-							</div>
-
-							<div class="sm:col-span-3">
-								<dt class="mb-1 font-medium opacity-70">{m.rules_reset_value()}:</dt>
-								<dd>{getResetValueLabel(criterion.reset_value)}</dd>
-							</div>
-						</dl>
-					</div>
-				{/each}
-			</div>
-		{/if}
-	</div>
-
-	{#snippet actions()}
-		<CwButton onclick={() => (open = false)}>{m.action_close()}</CwButton>
-	{/snippet}
-</CwDialog>
-
-<style>
-	.rule-dialog {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-4);
-	}
-
-	.rule-dialog__criteria {
-		display: flex;
-		flex-direction: column;
-		gap: var(--cw-space-3);
-	}
-
-	.rule-dialog__criterion {
-		padding: var(--cw-space-3);
-		border: 1px solid var(--cw-border-muted);
-		border-radius: var(--cw-radius-lg);
-		background: var(--cw-bg-subtle);
-	}
-
-	.rule-dialog__criterion-header {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		margin-bottom: var(--cw-space-3);
-	}
-
-	.rule-dialog__criterion-title {
-		font-size: var(--cw-text-sm);
-		font-weight: var(--cw-font-medium);
-	}
-</style>
diff --git a/src/routes/rules/create/+page.server.ts b/src/routes/rules/create/+page.server.ts
index 62486188..620a8be4 100644
--- a/src/routes/rules/create/+page.server.ts
+++ b/src/routes/rules/create/+page.server.ts
@@ -1,17 +1,24 @@
 import { ApiService } from '$lib/api/api.service';
+import type { RuleFormContextDto } from '$lib/api/api.dtos';
 import type { PageServerLoad } from './$types';
 
+const EMPTY_CONTEXT: RuleFormContextDto = {
+	devices: [],
+	locations: [],
+	actionTypes: [],
+	template: null
+};
+
 export const load: PageServerLoad = async ({ locals, fetch, url }) => {
 	const authToken = locals.jwtString ?? null;
 	const devEui = url.searchParams.get('dev_eui') ?? null;
 
 	if (!authToken) {
-		return { devices: [], devEui };
+		return { context: EMPTY_CONTEXT, authToken, devEui };
 	}
 
 	const api = new ApiService({ fetchFn: fetch, authToken });
+	const context = await api.getRuleFormContext().catch(() => EMPTY_CONTEXT);
 
-	const devices = await api.getAllDevices().catch(() => []);
-
-	return { devices, authToken, devEui };
+	return { context, authToken, devEui };
 };
diff --git a/src/routes/rules/create/+page.svelte b/src/routes/rules/create/+page.svelte
index a1da38f5..8304f78d 100644
--- a/src/routes/rules/create/+page.svelte
+++ b/src/routes/rules/create/+page.svelte
@@ -1,13 +1,40 @@
 <script lang="ts">
-	import RuleForm from '../RuleForm.svelte';
-	import type { PageData } from './$types';
+	import { goto } from '$app/navigation';
+	import { resolve } from '$app/paths';
+	import { AppPage } from '$lib/components/layout';
+	import { CwButton } from '@cropwatchdevelopment/cwui';
+	import { m } from '$lib/paraglide/messages.js';
+	import type { PageProps } from './$types';
+	import RuleTemplateForm from '../RuleTemplateForm.svelte';
 
-	let { data }: { data: PageData } = $props();
+	let { data }: PageProps = $props();
 </script>
 
-<RuleForm
-	mode="create"
-	devices={data.devices}
-	authToken={data.authToken}
-	initialDevEui={data.devEui}
-/>
+<svelte:head>
+	<title>{m.rules_new_create_page_title()}</title>
+</svelte:head>
+
+<AppPage width="lg">
+	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/rules'))}>
+		&larr; {m.action_back()}
+	</CwButton>
+
+	<div class="rules-new-create__header">
+		<h1>{m.rules_new_create_template()}</h1>
+	</div>
+
+	<RuleTemplateForm
+		mode="create"
+		context={data.context}
+		authToken={data.authToken}
+		preselectedDevEui={data.devEui}
+	/>
+</AppPage>
+
+<style>
+	.rules-new-create__header h1 {
+		margin: 0;
+		font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
+		font-weight: var(--cw-font-semibold);
+	}
+</style>
diff --git a/src/routes/rules/edit/[id]/+page.server.ts b/src/routes/rules/edit/[id]/+page.server.ts
index da9471f8..a52f39fe 100644
--- a/src/routes/rules/edit/[id]/+page.server.ts
+++ b/src/routes/rules/edit/[id]/+page.server.ts
@@ -1,44 +1,37 @@
-import { ApiService } from '$lib/api/api.service';
+import { ApiService, ApiServiceError } from '$lib/api/api.service';
+import type { RuleFormContextDto } from '$lib/api/api.dtos';
 import { m } from '$lib/paraglide/messages.js';
 import { error } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ locals, fetch, params }) => {
 	const authToken = locals.jwtString ?? null;
-	const ruleId = parseInt(params.id, 10);
+	const userId = locals.jwt?.sub ?? null;
+	const templateId = Number(params.id);
 
-	if (!authToken) {
+	if (!authToken || !userId) {
 		error(401, m.error_unauthorized_title());
 	}
 
-	if (isNaN(ruleId)) {
-		error(400, m.rules_invalid_rule_id());
+	if (!Number.isInteger(templateId) || templateId <= 0) {
+		error(400, m.rules_new_invalid_template_id());
 	}
 
 	const api = new ApiService({ fetchFn: fetch, authToken });
-
-	const [rawRule, rawDevices] = await Promise.all([
-		api.getRule(ruleId).catch(() => null),
-		api.getAllDevices().catch(() => [])
-	]);
-
-	if (!rawRule) {
-		error(404, m.rules_rule_not_found());
+	let context: RuleFormContextDto;
+	try {
+		context = await api.getRuleFormContext(templateId);
+	} catch (loadError) {
+		if (loadError instanceof ApiServiceError && loadError.status === 404) {
+			error(404, m.rules_new_rule_template_not_found());
+		}
+		console.error('Failed to load rule template:', loadError);
+		error(500, m.rules_new_load_failed());
 	}
 
-	const rule = {
-		...rawRule,
-		cw_rule_criteria: (rawRule.cw_rule_criteria ?? []).map((criterion) => {
-			const parsedId = typeof criterion.id === 'number' ? criterion.id : Number(criterion.id);
-
-			return {
-				...criterion,
-				id: Number.isFinite(parsedId) ? parsedId : 0
-			};
-		})
-	};
-
-	const devices = rawDevices;
+	if (!context.template) {
+		error(404, m.rules_new_rule_template_not_found());
+	}
 
-	return { rule, devices, authToken };
+	return { context, authToken };
 };
diff --git a/src/routes/rules/edit/[id]/+page.svelte b/src/routes/rules/edit/[id]/+page.svelte
index 2ce7ea78..3aaa3141 100644
--- a/src/routes/rules/edit/[id]/+page.svelte
+++ b/src/routes/rules/edit/[id]/+page.svelte
@@ -1,8 +1,49 @@
 <script lang="ts">
-	import RuleForm from '../../RuleForm.svelte';
-	import type { PageData } from './$types';
+	import { goto } from '$app/navigation';
+	import { resolve } from '$app/paths';
+	import { AppPage } from '$lib/components/layout';
+	import { CwButton, CwChip } from '@cropwatchdevelopment/cwui';
+	import { m } from '$lib/paraglide/messages.js';
+	import type { PageProps } from './$types';
+	import RuleTemplateForm from '../../RuleTemplateForm.svelte';
 
-	let { data }: { data: PageData } = $props();
+	let { data }: PageProps = $props();
+	const templateId = (() => data.context.template?.id ?? 0)();
 </script>
 
-<RuleForm mode="edit" devices={data.devices} authToken={data.authToken} rule={data.rule} />
+<svelte:head>
+	<title>{m.rules_new_edit_page_title()}</title>
+</svelte:head>
+
+<AppPage width="lg">
+	<CwButton variant="secondary" size="sm" onclick={() => goto(resolve('/rules'))}>
+		&larr; {m.action_back()}
+	</CwButton>
+
+	<div class="rules-new-edit__header">
+		<h1>{m.rules_new_edit_template()}</h1>
+		<CwChip
+			label={`${m.rules_new_template_id()}: ${templateId}`}
+			tone="info"
+			variant="outline"
+			size="sm"
+		/>
+	</div>
+
+	<RuleTemplateForm mode="edit" context={data.context} authToken={data.authToken} />
+</AppPage>
+
+<style>
+	.rules-new-edit__header {
+		display: flex;
+		align-items: center;
+		flex-wrap: wrap;
+		gap: var(--cw-space-3);
+	}
+
+	.rules-new-edit__header h1 {
+		margin: 0;
+		font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
+		font-weight: var(--cw-font-semibold);
+	}
+</style>
diff --git a/src/routes/rules-new/rule-template-alert-points.spec.ts b/src/routes/rules/rule-template-alert-points.spec.ts
similarity index 100%
rename from src/routes/rules-new/rule-template-alert-points.spec.ts
rename to src/routes/rules/rule-template-alert-points.spec.ts
diff --git a/src/routes/rules-new/rule-template-alert-points.ts b/src/routes/rules/rule-template-alert-points.ts
similarity index 100%
rename from src/routes/rules-new/rule-template-alert-points.ts
rename to src/routes/rules/rule-template-alert-points.ts