refactor(web): drop the settings entry from the space header
This commit is contained in:
1 parent
b847916a5b
commit
18185c5bd9
4 files changed
+8
-19
No files matched your search
@@ -8,7 +8,6 @@ import styles from './MobileDrawer.module.css';
|
|||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
rail: { id?: string; onCreate: () => void; onJoin: () => void };
|
rail: { id?: string; onCreate: () => void; onJoin: () => void };
|
||||||
onSettings: () => void;
|
|
||||||
/** 频道列表(ThreadSidebar),由 Workspace 组装 */
|
/** 频道列表(ThreadSidebar),由 Workspace 组装 */
|
||||||
threads: React.ReactNode;
|
threads: React.ReactNode;
|
||||||
onFiles: () => void;
|
onFiles: () => void;
|
||||||
@@ -25,13 +24,13 @@ function Row({ icon, label, count, onClick }: { icon: IconName; label: string; c
|
|||||||
}
|
}
|
||||||
|
|
||||||
/** 手机侧边栏:空间、频道、本频道的文件与成员;账号与外观在底部 */
|
/** 手机侧边栏:空间、频道、本频道的文件与成员;账号与外观在底部 */
|
||||||
export function MobileDrawer({ rail, onSettings, threads, onFiles, onMembers, onInvite, onShare, onHome }: Props) {
|
export function MobileDrawer({ rail, threads, onFiles, onMembers, onInvite, onShare, onHome }: Props) {
|
||||||
const used = useWorkspace((s) => s.channel?.membersUsed);
|
const used = useWorkspace((s) => s.channel?.membersUsed);
|
||||||
const max = useWorkspace((s) => s.channel?.maxMembers);
|
const max = useWorkspace((s) => s.channel?.maxMembers);
|
||||||
const spaces = useChannels((s) => s.list.length);
|
const spaces = useChannels((s) => s.list.length);
|
||||||
return <>
|
return <>
|
||||||
<SpaceRail {...rail} />
|
<SpaceRail {...rail} />
|
||||||
<SpaceHeader onSettings={onSettings} />
|
<SpaceHeader />
|
||||||
<div className={styles.scroll}>
|
<div className={styles.scroll}>
|
||||||
{threads}
|
{threads}
|
||||||
<nav className={styles.section} aria-label="本频道">
|
<nav className={styles.section} aria-label="本频道">
|
||||||
|
|||||||
@@ -54,17 +54,8 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: var(--bar-h);
|
min-height: var(--bar-h);
|
||||||
padding: 0 var(--space-4);
|
padding: 0 var(--space-4);
|
||||||
border: 0;
|
|
||||||
border-bottom: 1px solid var(--line);
|
border-bottom: 1px solid var(--line);
|
||||||
background: transparent;
|
|
||||||
color: var(--text);
|
color: var(--text);
|
||||||
font: inherit;
|
|
||||||
text-align: left;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header:hover {
|
|
||||||
background: var(--accent-soft);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.header strong {
|
.header strong {
|
||||||
|
|||||||
@@ -24,13 +24,12 @@ export function SpaceRail({ id, onCreate, onJoin }: RailProps) {
|
|||||||
</nav>;
|
</nav>;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 频道列表顶部:空间名与加密状态,点击打开空间设置 */
|
/** 频道列表顶部:空间名与加密状态。空间设置入口在顶栏 */
|
||||||
export function SpaceHeader({ onSettings }: { onSettings: () => void }) {
|
export function SpaceHeader() {
|
||||||
const channel = useWorkspace((s) => s.channel);
|
const channel = useWorkspace((s) => s.channel);
|
||||||
const name = channel?.name || `${channel?.id.slice(0, 8) ?? ''}…`;
|
const name = channel?.name || `${channel?.id.slice(0, 8) ?? ''}…`;
|
||||||
return <button type="button" className={styles.header} aria-label={`${name} 空间设置`} onClick={onSettings}>
|
return <div className={styles.header}>
|
||||||
{channel?.mode === 'raw' ? <span className={styles.raw}>明文</span> : <Icon name="lock" size={14} />}
|
{channel?.mode === 'raw' ? <span className={styles.raw}>明文</span> : <Icon name="lock" size={14} />}
|
||||||
<strong>{name}</strong>
|
<strong>{name}</strong>
|
||||||
<Icon name="settings" size={16} />
|
</div>;
|
||||||
</button>;
|
|
||||||
}
|
}
|
||||||
@@ -128,7 +128,7 @@ export function Workspace({ onCreateChannel }: { onCreateChannel: () => void })
|
|||||||
const threadSidebar = <ThreadSidebar threads={threads} groups={groups} selectedThreadId={activeThreadId} enabled={Boolean(channel?.canManageStructure)} owner={channel?.role === 'owner'} onHistory={setChannelHistory}
|
const threadSidebar = <ThreadSidebar threads={threads} groups={groups} selectedThreadId={activeThreadId} enabled={Boolean(channel?.canManageStructure)} owner={channel?.role === 'owner'} onHistory={setChannelHistory}
|
||||||
onSelectThread={(id) => { selectThread(id); setDrawerOpen(false); setMobileView('chat'); }} onCreateThread={createThread} onRenameThread={renameThread}
|
onSelectThread={(id) => { selectThread(id); setDrawerOpen(false); setMobileView('chat'); }} onCreateThread={createThread} onRenameThread={renameThread}
|
||||||
onCreateGroup={createGroup} onRenameGroup={renameGroup} onGroupThread={groupThread} />;
|
onCreateGroup={createGroup} onRenameGroup={renameGroup} onGroupThread={groupThread} />;
|
||||||
const navigation = <><SpaceHeader onSettings={() => setSettingsOpen(true)} />{threadSidebar}{desktop ? <Notepad /> : null}</>;
|
const navigation = <><SpaceHeader />{threadSidebar}{desktop ? <Notepad /> : null}</>;
|
||||||
const chat = <ChatPane threadName={activeThread?.name ?? '选择频道'} ids={messages} enabled={enabled} onSend={(text) => sendText(text, activeThreadId)} onDelete={deleteItem} onOpenFile={setPreviewId} onFiles={requestFiles} />;
|
const chat = <ChatPane threadName={activeThread?.name ?? '选择频道'} ids={messages} enabled={enabled} onSend={(text) => sendText(text, activeThreadId)} onDelete={deleteItem} onOpenFile={setPreviewId} onFiles={requestFiles} />;
|
||||||
const explorer = <>
|
const explorer = <>
|
||||||
<FilterBar filter={filter} searchOpen={searchOpen} onChange={setFilter} />
|
<FilterBar filter={filter} searchOpen={searchOpen} onChange={setFilter} />
|
||||||
@@ -161,7 +161,7 @@ export function Workspace({ onCreateChannel }: { onCreateChannel: () => void })
|
|||||||
{/* 弹层打开时抽屉留在下面:同时关抽屉(history.back)会把刚压入的弹层历史一并弹掉 */}
|
{/* 弹层打开时抽屉留在下面:同时关抽屉(history.back)会把刚压入的弹层历史一并弹掉 */}
|
||||||
{!desktop && drawerOpen ? <Drawer label="侧边栏" onClose={() => setDrawerOpen(false)}>
|
{!desktop && drawerOpen ? <Drawer label="侧边栏" onClose={() => setDrawerOpen(false)}>
|
||||||
<MobileDrawer rail={{ id: channel?.id, onCreate: onCreateChannel, onJoin: () => setScanOpen(true) }}
|
<MobileDrawer rail={{ id: channel?.id, onCreate: onCreateChannel, onJoin: () => setScanOpen(true) }}
|
||||||
onSettings={() => setSettingsOpen(true)} threads={threadSidebar} onFiles={() => goMobile('files')} onMembers={() => goMobile('members')}
|
threads={threadSidebar} onFiles={() => goMobile('files')} onMembers={() => goMobile('members')}
|
||||||
onInvite={owner ? () => setInviteOpen(true) : undefined} onShare={() => setPanelOpen(true)} onHome={() => navigate('/')} />
|
onInvite={owner ? () => setInviteOpen(true) : undefined} onShare={() => setPanelOpen(true)} onHome={() => navigate('/')} />
|
||||||
</Drawer> : null}
|
</Drawer> : null}
|
||||||
{!desktop && moreOpen ? <Sheet title="更多" onClose={() => setMoreOpen(false)}>{moreRows.map((row) => <Button key={row.label} variant="ghost" onClick={() => { setMoreOpen(false); row.run(); }}><Icon name={row.icon} size={18} />{row.label}</Button>)}</Sheet> : null}
|
{!desktop && moreOpen ? <Sheet title="更多" onClose={() => setMoreOpen(false)}>{moreRows.map((row) => <Button key={row.label} variant="ghost" onClick={() => { setMoreOpen(false); row.run(); }}><Icon name={row.icon} size={18} />{row.label}</Button>)}</Sheet> : null}
|
||||||
|
|||||||
Reference in new issue
Block a user