From 72c3087dd09e89d83a3e80e3638e325f963e0a4f Mon Sep 17 00:00:00 2001 From: Chaim Marcus Date: Thu, 26 Mar 2026 07:56:11 +0000 Subject: [PATCH] =?UTF-8?q?redesign:=20apply=20Stitch=20design=20system=20?= =?UTF-8?q?=E2=80=94=20Heebo=20font,=20glass=20header,=20Material=20icons,?= =?UTF-8?q?=20editorial=20tables?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dashboard/index.html | 5 +- dashboard/src/App.jsx | 321 +++++++++++++++++++++++++--------------- dashboard/src/index.css | 21 +++ 3 files changed, 229 insertions(+), 118 deletions(-) diff --git a/dashboard/index.html b/dashboard/index.html index de37b28..9a5bd1c 100644 --- a/dashboard/index.html +++ b/dashboard/index.html @@ -1,10 +1,11 @@ - + - extension-dashboard + Extension Platform +
diff --git a/dashboard/src/App.jsx b/dashboard/src/App.jsx index ed2663f..eb4dda1 100644 --- a/dashboard/src/App.jsx +++ b/dashboard/src/App.jsx @@ -14,26 +14,39 @@ function useFetch(url) { return { data, loading, reload } } -// --- Stats Bar --- +// --- Icon helper --- +function Icon({ name, className = '' }) { + return {name} +} + +// --- Stats Cards --- function StatsBar() { const { data } = useFetch(`${API}/stats`) if (!data) return null const items = [ - { label: 'הרחבות', value: data.total_extensions, color: 'bg-blue-500' }, - { label: 'לקוחות', value: data.total_customers, color: 'bg-green-500' }, - { label: 'רישיונות', value: data.total_licenses, color: 'bg-purple-500' }, - { label: 'פריסות מוצלחות', value: data.successful_deploys, color: 'bg-emerald-500' }, - { label: 'כשלונות', value: data.failed_deploys, color: 'bg-red-500' }, + { label: 'הרחבות פעילות', value: data.total_extensions, icon: 'extension', color: 'blue' }, + { label: 'לקוחות', value: data.total_customers, icon: 'group', color: 'slate' }, + { label: 'רישיונות', value: data.total_licenses, icon: 'key', color: 'slate' }, + { label: 'פריסות מוצלחות', value: data.successful_deploys, icon: 'check_circle', color: 'emerald', border: true }, + { label: 'כשלונות', value: data.failed_deploys, icon: 'error', color: 'red', border: true }, ] return ( -
+
{items.map(s => ( -
-
{s.value}
-
{s.label}
+
+
+
+ +
+
+
+

{s.value}

+

{s.label}

+
))} -
+
) } @@ -42,30 +55,49 @@ function ExtensionsTab() { const { data: extensions } = useFetch(`${API}/extensions`) if (!extensions) return return ( -
- - - - - - - - - - - - {extensions.map(e => ( - - - - - - +
+
+
+

רשימת הרחבות

+

כל ההרחבות הזמינות במערכת

+
+
+
+
שםComposerגרסה אחרונהלקוחותגרסאות
{e.name}{e.composer_name}{e.latest_version || '—'}{e.customer_count}{e.version_count}
+ + + + + + + - ))} - -
שם ההרחבהComposerגרסה אחרונהלקוחותגרסאות
-
+ + + {extensions.map(e => ( + + +
+
+ +
+ {e.name} +
+ + + {e.composer_name} + + + {e.latest_version || '—'} + + {e.customer_count} + {e.version_count} + + ))} + + +
+ ) } @@ -78,30 +110,45 @@ function CustomersTab() { if (!customers) return return (
-
+
-

לקוחות ({customers.length})

+

לקוחות ({customers.length})

{showForm && { setShowForm(false); reload() }} />} -
+
{customers.map(c => (
setSelected(c.id)} - className={`p-4 cursor-pointer hover:bg-gray-50 ${selected === c.id ? 'bg-blue-50 border-r-4 border-blue-500' : ''}`}> -
{c.name}
-
{c.espocrm_url}
-
- {c.extension_count} הרחבות • {c.is_active ? '🟢 פעיל' : '🔴 לא פעיל'} + className={`bg-white p-4 rounded-xl cursor-pointer transition-all ${selected === c.id ? 'ring-2 ring-blue-500 bg-blue-50/30' : 'hover:bg-slate-50'}`}> +
+
+ +
+
+

{c.name}

+

{c.espocrm_url}

+
+
+
+ {c.extension_count} הרחבות + • + {c.is_active ? 'פעיל' : 'לא פעיל'}
))}
-
- {selected && } +
+ {selected ? : ( +
+ +

בחר לקוח מהרשימה

+
+ )}
) @@ -116,17 +163,18 @@ function CustomerForm({ onDone }) { onDone() } return ( -
+
setForm({ ...form, name: e.target.value })} - className="w-full border rounded px-3 py-2 text-right" /> + className="w-full bg-slate-50 border-none rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 text-right" /> setForm({ ...form, email: e.target.value })} - className="w-full border rounded px-3 py-2 text-right" dir="ltr" /> + className="w-full bg-slate-50 border-none rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500" dir="ltr" /> setForm({ ...form, espocrm_url: e.target.value })} - className="w-full border rounded px-3 py-2" dir="ltr" /> + className="w-full bg-slate-50 border-none rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500" dir="ltr" /> setForm({ ...form, espocrm_api_key: e.target.value })} - className="w-full border rounded px-3 py-2 font-mono text-sm" dir="ltr" /> -
@@ -176,48 +224,67 @@ function CustomerDetail({ customerId }) { return (
-

{customer.name}

-
{customer.espocrm_url}
+
+
+ +
+
+

{customer.name}

+

{customer.espocrm_url}

+
+
{deployResult && ( -
+
+ {deployResult.module}: {deployResult.status === 'ok' ? 'הותקן בהצלחה!' : `שגיאה: ${deployResult.message}`}
)} -
- - - - - - - +
+
+

הרחבות מורשות

+ {(customer.extensions || []).length} הרחבות +
+
שם ההרחבהמותקנתעדכון זמיןפעולות
+ + + + + + - + {(customer.extensions || []).map(e => { const installed = e.installed_version const hasUpdate = installed && e.latest_version && installed !== e.latest_version return ( - - - + + - -
שם ההרחבהמותקנתעדכון זמיןפעולות
{e.name} +
+
+
+ +
+ {e.name} +
+ 		{installed - ? v{installed} - : לא מותקן} + ? v{installed} + : לא מותקן} + {hasUpdate - ? v{e.latest_version} - : —} + ? v{e.latest_version} + : —} -
+
+
{!installed ? ( ) : ( @@ -225,13 +292,15 @@ function CustomerDetail({ customerId }) { {hasUpdate && ( )} )} @@ -242,13 +311,13 @@ function CustomerDetail({ customerId }) { })}
-
+ {available.length > 0 && ( -
-

הוסף הרחבה:

+
+

הוסף הרחבה

@@ -263,73 +332,93 @@ function DeploymentsTab() { const { data: deployments } = useFetch(`${API}/deployments?limit=50`) if (!deployments) return return ( -
- - - - - - - - - +
+
+
+

לוג פריסות

+

היסטוריית כל הפריסות במערכת

+
+
+
לקוחהרחבהגרסהסטטוססוגזמן
+ + + + + + + + - + {deployments.map(d => ( - - - - - + + + + - - + + ))}
לקוחהרחבהגרסהסטטוססוגזמן
{d.customer_name}{d.extension_name}{d.version} - +
{d.customer_name} +
+
+ +
+ {d.extension_name} +
+ 		{d.version} + + {d.status === 'ok' ? 'הצלחה' : 'שגיאה'} {d.trigger_type === 'auto' ? 'אוטומטי' : 'ידני'}{d.started_at?.slice(0, 19)} + + {d.trigger_type === 'auto' ? 'אוטומטי' : 'ידני'} + + {d.started_at?.slice(0, 16).replace('T', ' ')}
-
+ ) } // --- Shared Components --- -function Badge({ children }) { - return {children} +function VersionBadge({ children }) { + return {children} } function Loader() { - return
טוען...
+ return
} // --- Main App --- export default function App() { const [tab, setTab] = useState('extensions') const tabs = [ - { id: 'extensions', label: 'הרחבות' }, - { id: 'customers', label: 'לקוחות' }, - { id: 'deployments', label: 'פריסות' }, + { id: 'extensions', label: 'הרחבות', icon: 'extension' }, + { id: 'customers', label: 'לקוחות', icon: 'group' }, + { id: 'deployments', label: 'פריסות', icon: 'analytics' }, ] return ( -
-
-
-

Extension Platform

-