From e5619bb0023cb1b0a96cb532e28cd6ca6a0ef9bd Mon Sep 17 00:00:00 2001
From: Harivansh Rathi <rathiharivansh@gmail.com>
Date: Tue, 31 Mar 2026 21:25:53 +0000
Subject: [PATCH] style the shell app

Co-authored-by: Codex <noreply@openai.com>
---
 .../css/ainascontrolplane.css                 | 85 +++++++++++++++++++
 apps/ainas-controlplane/img/app-dark.svg      |  6 ++
 apps/ainas-controlplane/img/app.svg           |  6 ++
 apps/ainas-controlplane/templates/admin.php   | 43 ++++++++++
 apps/ainas-controlplane/templates/index.php   | 51 +++++++++++
 5 files changed, 191 insertions(+)
 create mode 100644 apps/ainas-controlplane/css/ainascontrolplane.css
 create mode 100644 apps/ainas-controlplane/img/app-dark.svg
 create mode 100644 apps/ainas-controlplane/img/app.svg
 create mode 100644 apps/ainas-controlplane/templates/admin.php
 create mode 100644 apps/ainas-controlplane/templates/index.php

diff --git a/apps/ainas-controlplane/css/ainascontrolplane.css b/apps/ainas-controlplane/css/ainascontrolplane.css
new file mode 100644
index 0000000..d5aec9e
--- /dev/null
+++ b/apps/ainas-controlplane/css/ainascontrolplane.css
@@ -0,0 +1,85 @@
+.ainas-shell {
+	max-width: 1100px;
+	margin: 0 auto;
+	padding: 32px;
+}
+
+.ainas-shell__hero {
+	margin-bottom: 28px;
+	padding: 28px;
+	border-radius: 24px;
+	background: linear-gradient(135deg, #10212d 0%, #184152 100%);
+	color: #f6fafc;
+}
+
+.ainas-shell__eyebrow {
+	margin: 0 0 12px;
+	font-size: 12px;
+	letter-spacing: 0.12em;
+	text-transform: uppercase;
+	opacity: 0.8;
+}
+
+.ainas-shell__title {
+	margin: 0 0 12px;
+	font-size: 32px;
+	line-height: 1.1;
+}
+
+.ainas-shell__copy {
+	margin: 0;
+	max-width: 70ch;
+	font-size: 15px;
+	line-height: 1.6;
+}
+
+.ainas-shell__grid {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+	gap: 20px;
+}
+
+.ainas-shell__card {
+	padding: 24px;
+	border: 1px solid rgba(16, 33, 45, 0.12);
+	border-radius: 20px;
+	background: #ffffff;
+	box-shadow: 0 20px 40px rgba(16, 33, 45, 0.06);
+}
+
+.ainas-shell__card h2 {
+	margin-top: 0;
+}
+
+.ainas-shell__card dl {
+	display: grid;
+	grid-template-columns: minmax(120px, 160px) 1fr;
+	gap: 8px 16px;
+	margin: 0;
+}
+
+.ainas-shell__card dt {
+	font-weight: 600;
+}
+
+.ainas-shell__card dd {
+	margin: 0;
+}
+
+.ainas-shell__card code {
+	display: inline-block;
+	padding: 4px 8px;
+	border-radius: 999px;
+	background: #eef4f7;
+}
+
+.ainas-shell__card ul {
+	margin: 0;
+	padding-left: 20px;
+}
+
+.ainas-shell__error {
+	margin-top: 16px;
+	color: #b42318;
+}
+
diff --git a/apps/ainas-controlplane/img/app-dark.svg b/apps/ainas-controlplane/img/app-dark.svg
new file mode 100644
index 0000000..036cf93
--- /dev/null
+++ b/apps/ainas-controlplane/img/app-dark.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" fill="none">
+  <rect width="128" height="128" rx="28" fill="#0D1720"/>
+  <path d="M26 88L47 42H59L80 88H69L64 75H42L37 88H26ZM46 66H60L53 49L46 66Z" fill="#F6FAFC"/>
+  <path d="M78 88V42H90V78H110V88H78Z" fill="#4EC2B2"/>
+</svg>
+
diff --git a/apps/ainas-controlplane/img/app.svg b/apps/ainas-controlplane/img/app.svg
new file mode 100644
index 0000000..da33d40
--- /dev/null
+++ b/apps/ainas-controlplane/img/app.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" fill="none">
+  <rect width="128" height="128" rx="28" fill="#184152"/>
+  <path d="M26 88L47 42H59L80 88H69L64 75H42L37 88H26ZM46 66H60L53 49L46 66Z" fill="#F6FAFC"/>
+  <path d="M78 88V42H90V78H110V88H78Z" fill="#7CE0D2"/>
+</svg>
+
diff --git a/apps/ainas-controlplane/templates/admin.php b/apps/ainas-controlplane/templates/admin.php
new file mode 100644
index 0000000..37d622f
--- /dev/null
+++ b/apps/ainas-controlplane/templates/admin.php
@@ -0,0 +1,43 @@
+<?php
+
+declare(strict_types=1);
+
+use OCA\AinasControlplane\AppInfo\Application;
+use OCP\Util;
+
+Util::addStyle(Application::APP_ID, 'ainascontrolplane');
+
+$snapshot = $_['snapshot'];
+$reachable = !empty($snapshot['available']) ? 'yes' : 'no';
+$version = $snapshot['version']['version'] ?? 'unreachable';
+?>
+
+<div class="ainas-shell ainas-shell--admin">
+	<div class="ainas-shell__hero">
+		<p class="ainas-shell__eyebrow">Admin settings</p>
+		<h1 class="ainas-shell__title">aiNAS control-plane wiring</h1>
+		<p class="ainas-shell__copy">
+			The local scaffold wires this app to the control plane through the <code>AINAS_CONTROL_PLANE_URL</code> environment variable in the Nextcloud container.
+		</p>
+	</div>
+
+	<div class="ainas-shell__grid">
+		<section class="ainas-shell__card">
+			<h2>Current wiring</h2>
+			<dl>
+				<dt>Control-plane URL</dt>
+				<dd><code><?php p($_['controlPlaneUrl']); ?></code></dd>
+				<dt>Reachable</dt>
+				<dd><?php p($reachable); ?></dd>
+				<dt>Reported version</dt>
+				<dd><?php p($version); ?></dd>
+			</dl>
+		</section>
+
+		<section class="ainas-shell__card">
+			<h2>Next step</h2>
+			<p>Keep storage policy, sharing logic, and orchestration in the control-plane service. This page should remain a thin integration surface.</p>
+		</section>
+	</div>
+</div>
+
diff --git a/apps/ainas-controlplane/templates/index.php b/apps/ainas-controlplane/templates/index.php
new file mode 100644
index 0000000..3d1c3d8
--- /dev/null
+++ b/apps/ainas-controlplane/templates/index.php
@@ -0,0 +1,51 @@
+<?php
+
+declare(strict_types=1);
+
+use OCA\AinasControlplane\AppInfo\Application;
+use OCP\Util;
+
+Util::addStyle(Application::APP_ID, 'ainascontrolplane');
+
+$snapshot = $_['snapshot'];
+$version = $snapshot['version']['version'] ?? 'unreachable';
+$status = !empty($snapshot['available']) ? 'Connected' : 'Unavailable';
+$error = $snapshot['error'] ?? null;
+?>
+
+<div class="ainas-shell">
+	<div class="ainas-shell__hero">
+		<p class="ainas-shell__eyebrow">aiNAS inside Nextcloud</p>
+		<h1 class="ainas-shell__title"><?php p($_['appName']); ?></h1>
+		<p class="ainas-shell__copy">
+			This shell app stays intentionally thin. It exposes aiNAS entry points inside Nextcloud and delegates business logic to the external control-plane service.
+		</p>
+	</div>
+
+	<div class="ainas-shell__grid">
+		<section class="ainas-shell__card">
+			<h2>Control plane</h2>
+			<dl>
+				<dt>Configured URL</dt>
+				<dd><code><?php p($_['controlPlaneUrl']); ?></code></dd>
+				<dt>Status</dt>
+				<dd><?php p($status); ?></dd>
+				<dt>Version</dt>
+				<dd><?php p($version); ?></dd>
+			</dl>
+			<?php if ($error !== null): ?>
+				<p class="ainas-shell__error"><?php p($error); ?></p>
+			<?php endif; ?>
+		</section>
+
+		<section class="ainas-shell__card">
+			<h2>Boundary</h2>
+			<ul>
+				<li>Nextcloud provides file and client primitives.</li>
+				<li>aiNAS owns control-plane policy and orchestration.</li>
+				<li>The shell app only adapts between the two.</li>
+			</ul>
+		</section>
+	</div>
+</div>
+