Hub nav: Chat tab (branded self-hosted Element at element.occupymedia.cc)
This commit is contained in:
parent
7ea0b1e137
commit
e6a78a0805
2 changed files with 36 additions and 16 deletions
|
|
@ -8,7 +8,7 @@ import type { DraftRecord } from "../../lib/api-types";
|
|||
import { LogoMark } from "../brand/logo";
|
||||
import { NavIcon } from "../brand";
|
||||
|
||||
const NAV = [
|
||||
const NAV: { href: string; label: string; external?: boolean }[] = [
|
||||
{ href: "/streams", label: "Streams" },
|
||||
{ href: "/compose", label: "Compose" },
|
||||
{ href: "/calendar", label: "Calendar" },
|
||||
|
|
@ -18,6 +18,7 @@ const NAV = [
|
|||
{ href: "/approvals", label: "Approvals" },
|
||||
{ href: "/archive", label: "Archive" },
|
||||
{ href: "/files", label: "Files" },
|
||||
{ href: "https://element.occupymedia.cc", label: "Chat", external: true },
|
||||
{ href: "/analytics", label: "Analytics" },
|
||||
{ href: "/connections", label: "Channels" },
|
||||
{ href: "/team", label: "Team" },
|
||||
|
|
@ -49,15 +50,20 @@ export function Sidebar(): React.ReactElement {
|
|||
</div>
|
||||
<nav className="flex-1 overflow-y-auto scrollbar-thin p-2">
|
||||
{NAV.map((item) => {
|
||||
const active = pathname.startsWith(item.href);
|
||||
return (
|
||||
<Link
|
||||
key={item.href}
|
||||
href={item.href}
|
||||
className={`group flex items-center justify-between rounded-md px-3 py-1.5 text-sm transition-colors duration-150 ${item.href === "/control-room" ? "min-h-11" : ""} ${
|
||||
active ? "bg-accent-dim text-accent" : "text-text-dim hover:bg-surface-2 hover:text-text"
|
||||
}`}
|
||||
>
|
||||
const active = !item.external && pathname.startsWith(item.href);
|
||||
const className = `group flex items-center justify-between rounded-md px-3 py-1.5 text-sm transition-colors duration-150 ${item.href === "/control-room" ? "min-h-11" : ""} ${
|
||||
active ? "bg-accent-dim text-accent" : "text-text-dim hover:bg-surface-2 hover:text-text"
|
||||
}`;
|
||||
return item.external ? (
|
||||
<a key={item.href} href={item.href} target="_blank" rel="noreferrer" className={className}>
|
||||
<span className="flex items-center gap-2.5">
|
||||
<span className="h-1.5 w-1.5 rounded-full bg-border group-hover:bg-text-faint" />
|
||||
{item.label}
|
||||
</span>
|
||||
<span className="text-2xs text-text-faint">↗</span>
|
||||
</a>
|
||||
) : (
|
||||
<Link key={item.href} href={item.href} className={className}>
|
||||
<span className="flex items-center gap-2.5">
|
||||
{item.href === "/video" || item.href === "/control-room" || item.href === "/files" ? (
|
||||
<NavIcon name={item.href === "/files" ? "files" : "video"} size={14} />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue