diff --git a/app/src/admin/Shared.jsx b/app/src/admin/Shared.jsx
new file mode 100644
index 0000000..30b814e
--- /dev/null
+++ b/app/src/admin/Shared.jsx
@@ -0,0 +1,106 @@
+import { EmptyState } from '../../teknav-ui.jsx';
+import penLineIcon from '../assets/icons/pen-line.svg';
+import mailIcon from '../assets/icons/mail.svg';
+import triangleAlertIcon from '../assets/icons/triangle-alert.svg';
+
+const SIDEBAR_ITEMS = {
+  admin: [
+    { id: 'dashboard', label: 'داشبورد', icon: '◈' },
+    { id: 'articles', label: 'مدیریت مقاله‌ها', icon: '◉' },
+    { id: 'create', label: 'مقاله جدید', icon: '⊕' },
+    { id: 'users', label: 'مدیریت کاربران', icon: '◐' },
+    { id: 'authors', label: 'مدیریت نویسندگان', icon: penLineIcon },
+    { id: 'media', label: 'کتابخانه رسانه', icon: '▣' },
+    { id: 'comments', label: 'نظرها', icon: '◌' },
+    { id: 'analytics', label: 'تحلیل محتوا', icon: '▤' },
+    { id: 'reviews', label: 'گردش بررسی', icon: '◇' },
+    { id: 'newsletter', label: 'خبرنامه', icon: mailIcon },
+    { id: 'series', label: 'سری مقاله‌ها', icon: '▥' },
+    { id: 'categories', label: 'دسته‌بندی‌ها', icon: '⬡' },
+    { id: 'tags', label: 'برچسب‌ها', icon: '⬟' },
+    { id: 'seo-audit', label: 'ممیزی SEO', icon: '◈' },
+    { id: 'jobs', label: 'آگهی‌های شغلی', icon: '◑' },
+    { id: 'client-errors', label: 'خطاهای کلاینت', icon: triangleAlertIcon },
+    { id: 'activity', label: 'گزارش فعالیت', icon: '◷' },
+  ],
+  editor: [
+    { id: 'dashboard', label: 'داشبورد تحریریه', icon: '◈' },
+    { id: 'articles', label: 'مقاله‌ها', icon: '◉' },
+    { id: 'create', label: 'مقاله جدید', icon: '⊕' },
+    { id: 'authors', label: 'نویسندگان', icon: penLineIcon },
+    { id: 'media', label: 'کتابخانه رسانه', icon: '▣' },
+    { id: 'comments', label: 'نظرها', icon: '◌' },
+    { id: 'analytics', label: 'تحلیل محتوا', icon: '▤' },
+    { id: 'reviews', label: 'گردش بررسی', icon: '◇' },
+    { id: 'newsletter', label: 'خبرنامه', icon: mailIcon },
+    { id: 'series', label: 'سری مقاله‌ها', icon: '▥' },
+    { id: 'categories', label: 'دسته‌بندی‌ها', icon: '⬡' },
+  ],
+  writer: [
+    { id: 'dashboard', label: 'داشبورد من', icon: '◈' },
+    { id: 'create', label: 'نوشتن مقاله', icon: '⊕' },
+    { id: 'articles', label: 'مقاله‌های من', icon: '◉' },
+    { id: 'analytics', label: 'تحلیل نوشته‌ها', icon: '▤' },
+    { id: 'reviews', label: 'گردش بررسی', icon: '◇' },
+  ],
+  reviewer: [
+    { id: 'dashboard', label: 'داشبورد', icon: '◈' },
+    { id: 'articles', label: 'برای بررسی', icon: '◉' },
+    { id: 'reviews', label: 'گردش بررسی', icon: '◇' },
+  ],
+};
+
+const BRAND = {
+  primary: '#0F6B73',
+  primaryDark: '#073F45',
+  ink: '#0F2A2E',
+  muted: '#5F6B6D',
+  cream: '#FAF7F0',
+  panel: '#F4EFE6',
+  line: '#E4DDD2',
+  gold: '#D49A2A',
+  terracotta: '#C46A4D',
+};
+
+const BASE_DIAGRAM_CHOICES = [
+  { id: 'neural', label: 'هوش مصنوعی' },
+  { id: 'pipeline', label: 'فرآیند داده' },
+  { id: 'growth', label: 'رشد' },
+  { id: 'cyber', label: 'امنیت' },
+  { id: 'chip', label: 'سخت‌افزار' },
+  { id: 'arch', label: 'معماری' },
+  { id: 'timeline', label: 'زمان‌بندی' },
+  { id: 'wave', label: 'Wave Stream' },
+  { id: 'orbit', label: 'System Orbit' },
+  { id: 'brain', label: 'رابط عصبی' },
+  { id: 'database', label: 'ساختار داده' },
+  { id: 'cloud', label: 'زیرساخت ابری' },
+  { id: 'quantum', label: 'کوانتوم' },
+  { id: 'vla', label: 'مدل رباتیک' },
+  { id: 'dna', label: 'بیوتکنولوژی' },
+  { id: 'fusion', label: 'انرژی هسته‌ای' },
+  { id: 'satellite', label: 'فضا و ماهواره' },
+  { id: 'blockchain', label: 'بلاک‌چین' },
+];
+
+const EXTRA_DIAGRAM_CHOICES = Array.from({ length: 192 }, (_, idx) => {
+  const no = String(idx + 1).padStart(3, '0');
+  return { id: `diagram-${no}`, label: `دیاگرام تخصصی ${no}` };
+});
+
+const DIAGRAM_CHOICES = [...BASE_DIAGRAM_CHOICES, ...EXTRA_DIAGRAM_CHOICES];
+
+const actionBtn = { border: 'none', cursor: 'pointer', padding: '4px 10px', borderRadius: 6, fontSize: 11, fontFamily: 'Vazirmatn,sans-serif', fontWeight: 600, whiteSpace: 'nowrap' };
+
+const ADMIN_ROLE_NAMES = { admin: 'مدیر کل', editor: 'سردبیر', writer: 'نویسنده', reviewer: 'بازبین' };
+
+const SEO_SEVERITY = { error: { label: 'خطا', color: '#C94C4C', bg: '#FEF2F2' }, warning: { label: 'هشدار', color: '#C8951C', bg: '#FFFBEB' }, info: { label: 'پیشنهاد', color: '#0F6B73', bg: '#F0FDFA' } };
+
+function PanelState({ loading, error, empty, emptyTitle = 'داده‌ای برای نمایش وجود ندارد' }) {
+  if (loading) return <div style={{ color: '#5F6B6D', fontSize: 13, padding: '20px 0', direction: 'rtl' }}>در حال بارگذاری داده‌های واقعی از سرور...</div>;
+  if (error) return <EmptyState title="اتصال به API برقرار نشد" subtitle="داده نمونه نمایش داده نمی‌شود. پس از اتصال به بک‌اند دوباره تلاش کنید." />;
+  if (empty) return <EmptyState title={emptyTitle} />;
+  return null;
+}
+
+export { SIDEBAR_ITEMS, BRAND, BASE_DIAGRAM_CHOICES, EXTRA_DIAGRAM_CHOICES, DIAGRAM_CHOICES, PanelState, actionBtn, ADMIN_ROLE_NAMES, SEO_SEVERITY };