diff --git a/apps/web/src/components/domain-bindings-card.tsx b/apps/web/src/components/domain-bindings-card.tsx index de21207..c875b14 100644 --- a/apps/web/src/components/domain-bindings-card.tsx +++ b/apps/web/src/components/domain-bindings-card.tsx @@ -87,6 +87,7 @@ export function DomainBindingsCard({ bindings }: DomainBindingsCardProps) { icon={Link2Icon} title="Нет привязок" description="Привяжите сервис к поддомену" + centered={false} /> ) : ( diff --git a/apps/web/src/components/domains/domain-availability-panel.tsx b/apps/web/src/components/domains/domain-availability-panel.tsx index 71fff12..ca3a751 100644 --- a/apps/web/src/components/domains/domain-availability-panel.tsx +++ b/apps/web/src/components/domains/domain-availability-panel.tsx @@ -243,6 +243,7 @@ export function DomainAvailabilityPanel({ icon={ActivityIcon} title="Мониторы не настроены" description="Добавьте hostname для проверки доступности" + centered={false} /> ) : ( diff --git a/apps/web/src/components/empty-state.tsx b/apps/web/src/components/empty-state.tsx index cef336f..acff7ab 100644 --- a/apps/web/src/components/empty-state.tsx +++ b/apps/web/src/components/empty-state.tsx @@ -18,8 +18,18 @@ interface EmptyStateProps { className?: string /** Use IconStack media (empty-state-12). Default true. */ stackedIcon?: boolean + /** + * Center in available width/height (empty-state-12). + * Preview: https://reui.io/preview/base/empty-state-12 + * Set false for tight panels/sheets. + */ + centered?: boolean } +/** + * ReUI Empty + IconStack — adapted from empty-state-12. + * @see https://reui.io/preview/base/empty-state-12 + */ export function EmptyState({ icon: Icon = InboxIcon, title, @@ -27,9 +37,15 @@ export function EmptyState({ action, className, stackedIcon = true, + centered = true, }: EmptyStateProps) { - return ( - + const body = ( + {stackedIcon ? ( @@ -53,7 +69,24 @@ export function EmptyState({ ) : null} - {action ? {action} : null} + {action ? ( + + {action} + + ) : null} ) + + if (!centered) return body + + return ( +
+ {body} +
+ ) } diff --git a/apps/web/src/components/health/health-timeline.tsx b/apps/web/src/components/health/health-timeline.tsx index d53b3cb..0a35290 100644 --- a/apps/web/src/components/health/health-timeline.tsx +++ b/apps/web/src/components/health/health-timeline.tsx @@ -36,6 +36,7 @@ export function HealthTimeline({ events }: HealthTimelineProps) { icon={Link2Icon} title="Нет событий" description="Результаты проверок появятся после первого прогона" + centered={false} /> ) } diff --git a/apps/web/src/components/reui-kit/resource-page.tsx b/apps/web/src/components/reui-kit/resource-page.tsx index b8209ee..d875cec 100644 --- a/apps/web/src/components/reui-kit/resource-page.tsx +++ b/apps/web/src/components/reui-kit/resource-page.tsx @@ -242,11 +242,32 @@ export function ResourcePage({ if (data.length === 0 && emptyState) { return ( - + + {!hideHeader ? ( + +
+ {title} + {description ? ( + + {description} + + ) : null} +
+ {primaryAction ? ( +
+ {primaryAction} +
+ ) : null} +
+ ) : null} + + + + ) } diff --git a/apps/web/src/components/service-edit-sheet.tsx b/apps/web/src/components/service-edit-sheet.tsx index 6c771e0..cc6a072 100644 --- a/apps/web/src/components/service-edit-sheet.tsx +++ b/apps/web/src/components/service-edit-sheet.tsx @@ -509,6 +509,7 @@ export function ServiceEditSheet({ icon={Link2Icon} title="Нет привязок" description="Необязательно. Пример: newdom.ivx.su — зона ivx.su определится автоматически." + centered={false} action={