|
|
|
|
@@ -36,6 +36,7 @@ export default function Chat() {
|
|
|
|
|
const [groups, setGroups] = useState({ publicGroups: [], privateGroups: [] });
|
|
|
|
|
const [onlineUserIds, setOnlineUserIds] = useState(new Set());
|
|
|
|
|
const [activeGroupId, setActiveGroupId] = useState(null);
|
|
|
|
|
const [chatHasText, setChatHasText] = useState(false);
|
|
|
|
|
const [notifications, setNotifications] = useState([]);
|
|
|
|
|
const [unreadGroups, setUnreadGroups] = useState(new Map());
|
|
|
|
|
const [modal, setModal] = useState(null); // 'profile' | 'users' | 'settings' | 'newchat' | 'help' | 'groupmanager'
|
|
|
|
|
@@ -309,6 +310,12 @@ export default function Chat() {
|
|
|
|
|
}, [socket, toast, activeGroupId, user, isMobile, loadGroups]);
|
|
|
|
|
|
|
|
|
|
const selectGroup = (id) => {
|
|
|
|
|
// Warn if there's unsaved text in the message input and the user is switching conversations
|
|
|
|
|
if (chatHasText && id !== activeGroupId) {
|
|
|
|
|
const ok = window.confirm('You have unsaved text in the message box.\n\nContinue to discard it and open the new conversation, or Cancel to stay.');
|
|
|
|
|
if (!ok) return;
|
|
|
|
|
setChatHasText(false);
|
|
|
|
|
}
|
|
|
|
|
setActiveGroupId(id);
|
|
|
|
|
if (isMobile) {
|
|
|
|
|
setShowSidebar(false);
|
|
|
|
|
@@ -366,14 +373,14 @@ export default function Chat() {
|
|
|
|
|
</div>
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features} currentPage={page} isMobile={isMobile} />
|
|
|
|
|
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
|
|
|
|
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
|
|
|
|
@@ -393,24 +400,24 @@ export default function Chat() {
|
|
|
|
|
</div>
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features} currentPage={page} isMobile={isMobile} />
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features} currentPage={page} isMobile={isMobile} />
|
|
|
|
|
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
|
|
|
|
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
|
|
|
|
@@ -435,10 +442,10 @@ export default function Chat() {
|
|
|
|
|
unreadGroups={unreadGroups}
|
|
|
|
|
onNewChat={() => setModal('newchat')}
|
|
|
|
|
onProfile={() => setModal('profile')}
|
|
|
|
|
onUsers={() => setPage('users')}
|
|
|
|
|
onUsers={() => { setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onSettings={() => setModal('settings')}
|
|
|
|
|
onBranding={() => setModal('branding')}
|
|
|
|
|
onGroupManager={() => setPage('groups')}
|
|
|
|
|
onGroupManager={() => { setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
features={features}
|
|
|
|
|
onGroupsUpdated={loadGroups}
|
|
|
|
|
isMobile={isMobile}
|
|
|
|
|
@@ -454,19 +461,20 @@ export default function Chat() {
|
|
|
|
|
onGroupUpdated={loadGroups}
|
|
|
|
|
onDirectMessage={(g) => { loadGroups(); selectGroup(g.id); }}
|
|
|
|
|
onMessageDeleted={handleMessageDeleted}
|
|
|
|
|
onHasTextChange={setChatHasText}
|
|
|
|
|
onlineUserIds={onlineUserIds} />
|
|
|
|
|
)}
|
|
|
|
|
</div>
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen} onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features} currentPage={page} isMobile={isMobile} />
|
|
|
|
|
{modal === 'profile' && <ProfileModal onClose={() => setModal(null)} />}
|
|
|
|
|
{modal === 'settings' && <SettingsModal onClose={() => setModal(null)} onFeaturesChanged={setFeatures} />}
|
|
|
|
|
@@ -488,15 +496,15 @@ export default function Chat() {
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen}
|
|
|
|
|
onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features}
|
|
|
|
|
currentPage={page}
|
|
|
|
|
isMobile={isMobile} />
|
|
|
|
|
@@ -525,15 +533,15 @@ export default function Chat() {
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen}
|
|
|
|
|
onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features}
|
|
|
|
|
currentPage={page}
|
|
|
|
|
isMobile={isMobile} />
|
|
|
|
|
@@ -567,10 +575,10 @@ export default function Chat() {
|
|
|
|
|
unreadGroups={unreadGroups}
|
|
|
|
|
onNewChat={() => setModal('newchat')}
|
|
|
|
|
onProfile={() => setModal('profile')}
|
|
|
|
|
onUsers={() => setPage('users')}
|
|
|
|
|
onUsers={() => { setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onSettings={() => setModal('settings')}
|
|
|
|
|
onBranding={() => setModal('branding')}
|
|
|
|
|
onGroupManager={() => setPage('groups')}
|
|
|
|
|
onGroupManager={() => { setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
features={features}
|
|
|
|
|
onGroupsUpdated={loadGroups}
|
|
|
|
|
isMobile={isMobile}
|
|
|
|
|
@@ -587,6 +595,7 @@ export default function Chat() {
|
|
|
|
|
onGroupUpdated={loadGroups}
|
|
|
|
|
onDirectMessage={(g) => { loadGroups(); selectGroup(g.id); }}
|
|
|
|
|
onMessageDeleted={handleMessageDeleted}
|
|
|
|
|
onHasTextChange={setChatHasText}
|
|
|
|
|
onlineUserIds={onlineUserIds} />
|
|
|
|
|
)}
|
|
|
|
|
</div>
|
|
|
|
|
@@ -594,15 +603,15 @@ export default function Chat() {
|
|
|
|
|
<NavDrawer
|
|
|
|
|
open={drawerOpen}
|
|
|
|
|
onClose={() => setDrawerOpen(false)}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setPage('groups'); }}
|
|
|
|
|
onMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('chat'); }}
|
|
|
|
|
onGroupMessages={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groupmessages'); }}
|
|
|
|
|
onSchedule={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onScheduleManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('schedule'); }}
|
|
|
|
|
onGroupManager={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('groups'); }}
|
|
|
|
|
onBranding={() => { setDrawerOpen(false); setModal('branding'); }}
|
|
|
|
|
onSettings={() => { setDrawerOpen(false); setModal('settings'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setPage('hostpanel'); }}
|
|
|
|
|
onUsers={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('users'); }}
|
|
|
|
|
onHostPanel={() => { setDrawerOpen(false); setActiveGroupId(null); setChatHasText(false); setPage('hostpanel'); }}
|
|
|
|
|
features={features}
|
|
|
|
|
currentPage={page}
|
|
|
|
|
isMobile={isMobile} />
|
|
|
|
|
|