hamedandClaude Opus 5
4380e64a5d
Resources, branches, price lists, holidays and the new categories page sat in the settings menu but rendered bare, so clicking one made the settings sidebar disappear — the subscription page was the only one that kept it. Eleven pages now wrap in SettingsLayout with the key of the menu entry they belong to, and the four resource pages (list, types, skills, pools) share one menu entry plus a sub-nav between them, rather than four entries that would make the menu a third longer without making anything clearer. .seg accepts `a` as well as `button`, and treats `active` as an alias of `on`. Both were needed: cross-page tabs must be real links, and the pages already using `active` (service detail, clinic appointment settings) had no visible highlight at all. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
34 lines
1.2 KiB
TypeScript
34 lines
1.2 KiB
TypeScript
import React from 'react';
|
|
import { Link, useLocation } from 'react-router-dom';
|
|
|
|
const LINKS = [
|
|
{ to: '/admin/resources', label: 'منابع' },
|
|
{ to: '/admin/resources/types', label: 'نوع منابع' },
|
|
{ to: '/admin/resources/skills', label: 'مهارتها' },
|
|
{ to: '/admin/resources/pools', label: 'استخر منابع' },
|
|
];
|
|
|
|
/**
|
|
* چهار صفحهٔ خانوادهٔ منابع، یک آیتم در منوی تنظیمات دارند؛ این نوار جابهجایی بینشان
|
|
* است. اگر هر چهار تا آیتم جدا در منو میگرفتند، منوی تنظیمات یکسوم بلندتر میشد بیآنکه
|
|
* چیزی روشنتر شود.
|
|
*/
|
|
export default function ResourcesSubNav() {
|
|
const { pathname } = useLocation();
|
|
|
|
return (
|
|
<div className="seg" style={{ marginBottom: 'var(--gap)', overflowX: 'auto', flexWrap: 'nowrap' }}>
|
|
{LINKS.map((l) => (
|
|
<Link
|
|
key={l.to}
|
|
to={l.to}
|
|
className={pathname === l.to ? 'active' : ''}
|
|
style={{ whiteSpace: 'nowrap' }}
|
|
>
|
|
{l.label}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|