67853a05c0
* Now adapting to small screen sizes, needs improvements * Fix that site only gets into mobile mode when resized * - Added navigation event triggered if user requests to return to navigation on compact screens - People drawer wont be shown on compact screens - Still accessible using settings - would be duplicated UI - mobileSize is now compactSize * Put threshold for collapsing the base UI in a shared file * Switch to a more simple solution using CSS media queries over JS - Move back button to the left a bit so it doesnt get in touch with room icon * switch from component-individual-thresholds to device-type thresholds - <750px: Mobile - <900px: Tablet - >900px: Desktop * Make Settings drawer component collapse on mobile * Fix EmojiBoard not showing up and messing up UI when screen is smaller than 360px * Improve code quality; allow passing classNames to IconButton - remove unnessesary div wrappers - use dir.side where appropriate - rename threshold and its mixins to more descriptive names - Rename "OPEN_NAVIGATION" to "NAVIGATION_OPENED" * - follow BEM methology - remove ROOM_SELECTED listener - rename NAVIGATION_OPENED to OPEN_NAVIGATION where appropriate - this does NOT changes that ref should be used for changing visability * Use ref to change visability to avoid re-rendering * Use ref to change visability to avoid re-rendering * Fix that room component is not hidden by default. This resulted in a broken view when application is viewed in mobile size without having selected a room since loading. * fix: leaving a room should bring one back to navigation Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
171 lines
3.5 KiB
JavaScript
171 lines
3.5 KiB
JavaScript
import appDispatcher from '../dispatcher';
|
|
import cons from '../state/cons';
|
|
|
|
export function selectTab(tabId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.SELECT_TAB,
|
|
tabId,
|
|
});
|
|
}
|
|
|
|
export function selectSpace(roomId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.SELECT_SPACE,
|
|
roomId,
|
|
});
|
|
}
|
|
|
|
export function selectRoom(roomId, eventId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.SELECT_ROOM,
|
|
roomId,
|
|
eventId,
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Open navigation on compact screen sizes
|
|
*/
|
|
export function openNavigation() {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_NAVIGATION,
|
|
});
|
|
}
|
|
|
|
export function openSpaceSettings(roomId, tabText) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SPACE_SETTINGS,
|
|
roomId,
|
|
tabText,
|
|
});
|
|
}
|
|
|
|
export function openSpaceManage(roomId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SPACE_MANAGE,
|
|
roomId,
|
|
});
|
|
}
|
|
|
|
export function openSpaceAddExisting(roomId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SPACE_ADDEXISTING,
|
|
roomId,
|
|
});
|
|
}
|
|
|
|
export function toggleRoomSettings(tabText) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.TOGGLE_ROOM_SETTINGS,
|
|
tabText,
|
|
});
|
|
}
|
|
|
|
export function openShortcutSpaces() {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SHORTCUT_SPACES,
|
|
});
|
|
}
|
|
|
|
export function openInviteList() {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_INVITE_LIST,
|
|
});
|
|
}
|
|
|
|
export function openPublicRooms(searchTerm) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_PUBLIC_ROOMS,
|
|
searchTerm,
|
|
});
|
|
}
|
|
|
|
export function openCreateRoom(isSpace = false, parentId = null) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_CREATE_ROOM,
|
|
isSpace,
|
|
parentId,
|
|
});
|
|
}
|
|
|
|
export function openInviteUser(roomId, searchTerm) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_INVITE_USER,
|
|
roomId,
|
|
searchTerm,
|
|
});
|
|
}
|
|
|
|
export function openProfileViewer(userId, roomId) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_PROFILE_VIEWER,
|
|
userId,
|
|
roomId,
|
|
});
|
|
}
|
|
|
|
export function openSettings(tabText) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SETTINGS,
|
|
tabText,
|
|
});
|
|
}
|
|
|
|
export function openEmojiBoard(cords, requestEmojiCallback) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_EMOJIBOARD,
|
|
cords,
|
|
requestEmojiCallback,
|
|
});
|
|
}
|
|
|
|
export function openReadReceipts(roomId, userIds) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_READRECEIPTS,
|
|
roomId,
|
|
userIds,
|
|
});
|
|
}
|
|
|
|
export function openViewSource(event) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_VIEWSOURCE,
|
|
event,
|
|
});
|
|
}
|
|
|
|
export function replyTo(userId, eventId, body) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.CLICK_REPLY_TO,
|
|
userId,
|
|
eventId,
|
|
body,
|
|
});
|
|
}
|
|
|
|
export function openSearch(term) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_SEARCH,
|
|
term,
|
|
});
|
|
}
|
|
|
|
export function openReusableContextMenu(placement, cords, render, afterClose) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_REUSABLE_CONTEXT_MENU,
|
|
placement,
|
|
cords,
|
|
render,
|
|
afterClose,
|
|
});
|
|
}
|
|
|
|
export function openReusableDialog(title, render, afterClose) {
|
|
appDispatcher.dispatch({
|
|
type: cons.actions.navigation.OPEN_REUSABLE_DIALOG,
|
|
title,
|
|
render,
|
|
afterClose,
|
|
});
|
|
}
|