v0.10.4 new UI changes
This commit is contained in:
@@ -6,7 +6,8 @@ import { api } from '../utils/api.js';
|
||||
import Sidebar from '../components/Sidebar.jsx';
|
||||
import ChatWindow from '../components/ChatWindow.jsx';
|
||||
import ProfileModal from '../components/ProfileModal.jsx';
|
||||
import UserManagerModal from '../components/UserManagerModal.jsx';
|
||||
import UserManagerPage from './UserManagerPage.jsx';
|
||||
import GroupManagerPage from './GroupManagerPage.jsx';
|
||||
import HostPanel from '../components/HostPanel.jsx';
|
||||
import SettingsModal from '../components/SettingsModal.jsx';
|
||||
import BrandingModal from '../components/BrandingModal.jsx';
|
||||
@@ -15,9 +16,7 @@ import GlobalBar from '../components/GlobalBar.jsx';
|
||||
import AboutModal from '../components/AboutModal.jsx';
|
||||
import HelpModal from '../components/HelpModal.jsx';
|
||||
import NavDrawer from '../components/NavDrawer.jsx';
|
||||
import GroupManagerModal from '../components/GroupManagerModal.jsx';
|
||||
import SchedulePage from '../components/SchedulePage.jsx';
|
||||
import MobileGroupManager from '../components/MobileGroupManager.jsx';
|
||||
import './Chat.css';
|
||||
|
||||
function urlBase64ToUint8Array(base64String) {
|
||||
@@ -334,6 +333,54 @@ export default function Chat() {
|
||||
|
||||
const isToolManager = user?.role === 'admin' || (features.teamToolManagers || []).some(gid => (features.userGroupMemberships || []).includes(gid));
|
||||
|
||||
if (page === 'users') {
|
||||
return (
|
||||
<div className="chat-layout">
|
||||
<GlobalBar isMobile={isMobile} showSidebar={true} onBurger={() => setDrawerOpen(true)} />
|
||||
<div className="chat-body" style={{ overflow: 'hidden' }}>
|
||||
<UserManagerPage />
|
||||
</div>
|
||||
<NavDrawer
|
||||
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
||||
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
||||
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
||||
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
||||
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
||||
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
||||
features={features} currentPage={page} isMobile={isMobile}
|
||||
/>
|
||||
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
||||
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (page === 'groups') {
|
||||
return (
|
||||
<div className="chat-layout">
|
||||
<GlobalBar isMobile={isMobile} showSidebar={true} onBurger={() => setDrawerOpen(true)} />
|
||||
<div className="chat-body" style={{ overflow: 'hidden' }}>
|
||||
<GroupManagerPage />
|
||||
</div>
|
||||
<NavDrawer
|
||||
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
||||
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
||||
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
||||
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
||||
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
||||
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
||||
features={features} currentPage={page} isMobile={isMobile}
|
||||
/>
|
||||
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
||||
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (page === 'hostpanel') {
|
||||
return (
|
||||
<div className="chat-layout">
|
||||
@@ -382,20 +429,19 @@ export default function Chat() {
|
||||
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
||||
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onScheduleManager={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); if(isMobile) setModal('mobilegroupmanager'); else setModal('groupmanager'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
||||
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
||||
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setModal('users'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
||||
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
||||
features={features}
|
||||
currentPage={page}
|
||||
isMobile={isMobile}
|
||||
/>
|
||||
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
||||
{modal === 'users' && <UserManagerModal onClose={() => setModal(null)} />}
|
||||
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
||||
{modal === 'branding' && <BrandingModal onClose={() => setModal(null)} />}
|
||||
{modal === 'groupmanager' && <GroupManagerModal onClose={() => setModal(null)} />}
|
||||
|
||||
{modal === 'mobilegroupmanager' && (
|
||||
<div style={{ position:'fixed',inset:0,zIndex:200,background:'var(--background)' }}>
|
||||
<MobileGroupManager onClose={() => setModal(null)}/>
|
||||
@@ -422,10 +468,10 @@ export default function Chat() {
|
||||
unreadGroups={unreadGroups}
|
||||
onNewChat={() => setModal('newchat')}
|
||||
onProfile={() => setModal('profile')}
|
||||
onUsers={() => setModal('users')}
|
||||
onUsers={() => setPage('users')}
|
||||
onSettings={() => setModal('settings')}
|
||||
onBranding={() => setModal('branding')}
|
||||
onGroupManager={() => isMobile ? setModal('mobilegroupmanager') : setModal('groupmanager')}
|
||||
onGroupManager={() => setPage('groups')}
|
||||
features={features}
|
||||
onGroupsUpdated={loadGroups}
|
||||
isMobile={isMobile}
|
||||
@@ -452,25 +498,18 @@ export default function Chat() {
|
||||
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
||||
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onScheduleManager={() => { setDrawerOpen(false); setPage('schedule'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); if(isMobile) setModal('mobilegroupmanager'); else setModal('groupmanager'); }}
|
||||
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
||||
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
||||
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setModal('users'); }}
|
||||
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
||||
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
||||
features={features}
|
||||
currentPage={page}
|
||||
isMobile={isMobile}
|
||||
/>
|
||||
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
||||
{modal === 'users' && <UserManagerModal onClose={() => setModal(null)} />}
|
||||
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
||||
{modal === 'branding' && <BrandingModal onClose={() => setModal(null)} />}
|
||||
{modal === 'groupmanager' && <GroupManagerModal onClose={() => setModal(null)} />}
|
||||
{modal === 'mobilegroupmanager' && (
|
||||
<div style={{ position:'fixed',inset:0,zIndex:200,background:'var(--background)' }}>
|
||||
<MobileGroupManager onClose={() => setModal(null)}/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{modal === 'newchat' && <NewChatModal onClose={() => setModal(null)} onCreated={(g) => { loadGroups(); setModal(null); setActiveGroupId(g.id); }} />}
|
||||
{modal === 'about' && <AboutModal onClose={() => setModal(null)} />}
|
||||
|
||||
Reference in New Issue
Block a user