diff --git a/src/App.scss b/src/App.scss index 362c8c9f..65597415 100644 --- a/src/App.scss +++ b/src/App.scss @@ -59,6 +59,11 @@ $nitropedia-height: 400px; $messenger-width: 500px; $messenger-height: 370px; +$marketplace-post-offer-width: 430px; +$marketplace-post-offer-height: 250px; + +$room-info-width: 325px; + .nitro-app { width: 100%; height: 100%; diff --git a/src/components/index.scss b/src/components/index.scss index b19fdc6e..83df5b8b 100644 --- a/src/components/index.scss +++ b/src/components/index.scss @@ -2,4 +2,5 @@ @import './avatar-editor/AvatarEditorView'; @import './catalog/CatalogView'; @import './inventory/InventoryView'; +@import './navigator/NavigatorView'; @import './toolbar/ToolbarView'; diff --git a/src/views/navigator/NavigatorMessageHandler.tsx b/src/components/navigator/NavigatorMessageHandler.tsx similarity index 100% rename from src/views/navigator/NavigatorMessageHandler.tsx rename to src/components/navigator/NavigatorMessageHandler.tsx diff --git a/src/views/navigator/NavigatorView.scss b/src/components/navigator/NavigatorView.scss similarity index 100% rename from src/views/navigator/NavigatorView.scss rename to src/components/navigator/NavigatorView.scss diff --git a/src/views/navigator/NavigatorView.tsx b/src/components/navigator/NavigatorView.tsx similarity index 100% rename from src/views/navigator/NavigatorView.tsx rename to src/components/navigator/NavigatorView.tsx diff --git a/src/views/navigator/common/INavigatorSearchFilter.ts b/src/components/navigator/common/INavigatorSearchFilter.ts similarity index 100% rename from src/views/navigator/common/INavigatorSearchFilter.ts rename to src/components/navigator/common/INavigatorSearchFilter.ts diff --git a/src/views/navigator/common/RoomInfoData.ts b/src/components/navigator/common/RoomInfoData.ts similarity index 100% rename from src/views/navigator/common/RoomInfoData.ts rename to src/components/navigator/common/RoomInfoData.ts diff --git a/src/views/navigator/common/RoomSettingsData.ts b/src/components/navigator/common/RoomSettingsData.ts similarity index 100% rename from src/views/navigator/common/RoomSettingsData.ts rename to src/components/navigator/common/RoomSettingsData.ts diff --git a/src/views/navigator/common/RoomSettingsUtils.ts b/src/components/navigator/common/RoomSettingsUtils.ts similarity index 100% rename from src/views/navigator/common/RoomSettingsUtils.ts rename to src/components/navigator/common/RoomSettingsUtils.ts diff --git a/src/views/navigator/common/SearchFilterOptions.ts b/src/components/navigator/common/SearchFilterOptions.ts similarity index 100% rename from src/views/navigator/common/SearchFilterOptions.ts rename to src/components/navigator/common/SearchFilterOptions.ts diff --git a/src/views/navigator/context/NavigatorContext.tsx b/src/components/navigator/context/NavigatorContext.tsx similarity index 100% rename from src/views/navigator/context/NavigatorContext.tsx rename to src/components/navigator/context/NavigatorContext.tsx diff --git a/src/views/navigator/reducers/NavigatorReducer.tsx b/src/components/navigator/reducers/NavigatorReducer.tsx similarity index 100% rename from src/views/navigator/reducers/NavigatorReducer.tsx rename to src/components/navigator/reducers/NavigatorReducer.tsx diff --git a/src/views/navigator/views/NavigatorViews.scss b/src/components/navigator/views/NavigatorViews.scss similarity index 100% rename from src/views/navigator/views/NavigatorViews.scss rename to src/components/navigator/views/NavigatorViews.scss diff --git a/src/views/navigator/views/creator/NavigatorRoomCreatorView.scss b/src/components/navigator/views/creator/NavigatorRoomCreatorView.scss similarity index 100% rename from src/views/navigator/views/creator/NavigatorRoomCreatorView.scss rename to src/components/navigator/views/creator/NavigatorRoomCreatorView.scss diff --git a/src/views/navigator/views/creator/NavigatorRoomCreatorView.tsx b/src/components/navigator/views/creator/NavigatorRoomCreatorView.tsx similarity index 98% rename from src/views/navigator/views/creator/NavigatorRoomCreatorView.tsx rename to src/components/navigator/views/creator/NavigatorRoomCreatorView.tsx index bfc1bb51..d747180d 100644 --- a/src/views/navigator/views/creator/NavigatorRoomCreatorView.tsx +++ b/src/components/navigator/views/creator/NavigatorRoomCreatorView.tsx @@ -4,7 +4,7 @@ import classNames from 'classnames'; import { FC, useCallback, useEffect, useState } from 'react'; import { GetConfiguration, GetSessionDataManager, LocalizeText } from '../../../../api'; import { SendMessageHook } from '../../../../hooks/messages'; -import { CurrencyIcon } from '../../../shared/currency-icon/CurrencyIcon'; +import { CurrencyIcon } from '../../../../views/shared/currency-icon/CurrencyIcon'; import { useNavigatorContext } from '../../context/NavigatorContext'; import { NavigatorRoomCreatorViewProps, NAVIGATOR_ROOM_MODELS } from './NavigatorRoomCreatorView.types'; diff --git a/src/views/navigator/views/creator/NavigatorRoomCreatorView.types.ts b/src/components/navigator/views/creator/NavigatorRoomCreatorView.types.ts similarity index 100% rename from src/views/navigator/views/creator/NavigatorRoomCreatorView.types.ts rename to src/components/navigator/views/creator/NavigatorRoomCreatorView.types.ts diff --git a/src/views/navigator/views/room-doorbell/NavigatorRoomDoorbellView.tsx b/src/components/navigator/views/room-doorbell/NavigatorRoomDoorbellView.tsx similarity index 100% rename from src/views/navigator/views/room-doorbell/NavigatorRoomDoorbellView.tsx rename to src/components/navigator/views/room-doorbell/NavigatorRoomDoorbellView.tsx diff --git a/src/views/navigator/views/room-doorbell/NavigatorRoomDoorbellView.types.ts b/src/components/navigator/views/room-doorbell/NavigatorRoomDoorbellView.types.ts similarity index 100% rename from src/views/navigator/views/room-doorbell/NavigatorRoomDoorbellView.types.ts rename to src/components/navigator/views/room-doorbell/NavigatorRoomDoorbellView.types.ts diff --git a/src/views/navigator/views/room-info/NavigatorRoomInfoView.scss b/src/components/navigator/views/room-info/NavigatorRoomInfoView.scss similarity index 55% rename from src/views/navigator/views/room-info/NavigatorRoomInfoView.scss rename to src/components/navigator/views/room-info/NavigatorRoomInfoView.scss index 4e6c4ae9..7f10ad0c 100644 --- a/src/views/navigator/views/room-info/NavigatorRoomInfoView.scss +++ b/src/components/navigator/views/room-info/NavigatorRoomInfoView.scss @@ -1,5 +1,7 @@ .nitro-room-info { - width: 250px; + width: $room-info-width; + max-height: 300px; + .gray { filter: grayscale(1); @@ -10,12 +12,8 @@ position: relative; width: 110px; height: 110px; - margin: 0 auto; - background-image: url(../../../../assets/images/navigator/thumbnail_placeholder.png); - background-repeat: no-repeat; - background-position: center; + background: url("../../../../assets/images/navigator/thumbnail_placeholder.png") no-repeat center; background-color: rgba($black, .125); - border-color: $black !important; } .group-badge { diff --git a/src/components/navigator/views/room-info/NavigatorRoomInfoView.tsx b/src/components/navigator/views/room-info/NavigatorRoomInfoView.tsx new file mode 100644 index 00000000..8cbc4f1a --- /dev/null +++ b/src/components/navigator/views/room-info/NavigatorRoomInfoView.tsx @@ -0,0 +1,203 @@ +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { RoomMuteComposer, RoomSettingsComposer, RoomStaffPickComposer, SecurityLevel, UserHomeRoomComposer } from '@nitrots/nitro-renderer'; +import classNames from 'classnames'; +import { FC, useCallback, useEffect, useState } from 'react'; +import { GetConfiguration, GetGroupInformation, GetSessionDataManager, LocalizeText } from '../../../../api'; +import { Button } from '../../../../common/Button'; +import { Column } from '../../../../common/Column'; +import { Flex } from '../../../../common/Flex'; +import { Grid } from '../../../../common/Grid'; +import { Text } from '../../../../common/Text'; +import { NavigatorEvent } from '../../../../events'; +import { FloorplanEditorEvent } from '../../../../events/floorplan-editor/FloorplanEditorEvent'; +import { RoomWidgetThumbnailEvent } from '../../../../events/room-widgets/thumbnail'; +import { BatchUpdates } from '../../../../hooks'; +import { dispatchUiEvent } from '../../../../hooks/events'; +import { SendMessageHook } from '../../../../hooks/messages'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView, UserProfileIconView } from '../../../../layout'; +import { RoomThumbnailView } from '../../../../layout/room-thumbnail/RoomThumbnailView'; +import { BadgeImageView } from '../../../../views/shared/badge-image/BadgeImageView'; +import { useNavigatorContext } from '../../context/NavigatorContext'; +import { NavigatorActions } from '../../reducers/NavigatorReducer'; + +export class NavigatorRoomInfoViewProps +{ + onCloseClick: () => void; +} + +export const NavigatorRoomInfoView: FC = props => +{ + const { onCloseClick = null } = props; + const [ roomThumbnail, setRoomThumbnail ] = useState(null); + const [ isRoomPicked, setIsRoomPicked ] = useState(false); + const [ isRoomMuted, setIsRoomMuted ] = useState(false); + const { navigatorState = null, dispatchNavigatorState = null } = useNavigatorContext(); + const { roomInfoData = null, homeRoomId = null } = navigatorState; + + const hasPermission = (permission: string) => + { + switch(permission) + { + case 'settings': + return GetSessionDataManager().securityLevel >= SecurityLevel.MODERATOR || roomInfoData.currentRoomOwner; + case 'staff_pick': + return GetSessionDataManager().securityLevel >= SecurityLevel.COMMUNITY; + default: return false; + } + } + + const processAction = useCallback((action: string, value?: string) => + { + if(!roomInfoData || !roomInfoData.enteredGuestRoom) return; + + switch(action) + { + case 'set_home_room': + let newRoomId = -1; + + if(homeRoomId !== roomInfoData.enteredGuestRoom.roomId) + { + newRoomId = roomInfoData.enteredGuestRoom.roomId; + } + + dispatchNavigatorState({ + type: NavigatorActions.SET_HOME_ROOM_ID, + payload: { + homeRoomId: newRoomId + } + }); + + SendMessageHook(new UserHomeRoomComposer(newRoomId)); + return; + case 'navigator_search_tag': + return; + case 'open_room_thumbnail_camera': + dispatchUiEvent(new RoomWidgetThumbnailEvent(RoomWidgetThumbnailEvent.TOGGLE_THUMBNAIL)); + return; + case 'open_group_info': + GetGroupInformation(roomInfoData.enteredGuestRoom.habboGroupId); + return; + case 'toggle_room_link': + dispatchUiEvent(new NavigatorEvent(NavigatorEvent.TOGGLE_ROOM_LINK)); + return; + case 'open_room_settings': + SendMessageHook(new RoomSettingsComposer(roomInfoData.enteredGuestRoom.roomId)); + return; + case 'toggle_pick': + setIsRoomPicked(value => !value); + SendMessageHook(new RoomStaffPickComposer(roomInfoData.enteredGuestRoom.roomId)); + return; + case 'toggle_mute': + setIsRoomMuted(value => !value); + SendMessageHook(new RoomMuteComposer()); + return; + case 'open_floorplan_editor': + dispatchUiEvent(new FloorplanEditorEvent(FloorplanEditorEvent.TOGGLE_FLOORPLAN_EDITOR)); + return; + case 'close': + onCloseClick(); + return; + } + + }, [ onCloseClick, dispatchNavigatorState, roomInfoData, homeRoomId ]); + + useEffect(() => + { + if(!roomInfoData || !roomInfoData.enteredGuestRoom) return; + + let thumbnailUrl: string = null; + + if(roomInfoData.enteredGuestRoom.officialRoomPicRef) + { + thumbnailUrl = (GetConfiguration('image.library.url') + roomInfoData.enteredGuestRoom.officialRoomPicRef); + } + else + { + thumbnailUrl = (GetConfiguration('thumbnails.url').replace('%thumbnail%', roomInfoData.enteredGuestRoom.roomId.toString())); + } + + BatchUpdates(() => + { + setRoomThumbnail(thumbnailUrl); + setIsRoomPicked(roomInfoData.enteredGuestRoom.roomPicker); + setIsRoomMuted(roomInfoData.enteredGuestRoom.allInRoomMuted); + }); + }, [ roomInfoData ]); + + if(!roomInfoData) return null; + + return ( + + processAction('close') } /> + + { roomInfoData.enteredGuestRoom && + <> + + + + { hasPermission('settings') && processAction('open_room_thumbnail_camera') } /> } + + + + + + { roomInfoData.enteredGuestRoom.roomName } + { roomInfoData.enteredGuestRoom.showOwner && + + { LocalizeText('navigator.roomownercaption') } + + + { roomInfoData.enteredGuestRoom.ownerName } + + } + + { LocalizeText('navigator.roomrating') } + { roomInfoData.enteredGuestRoom.score } + + { (roomInfoData.enteredGuestRoom.tags.length > 0) && + + { roomInfoData.enteredGuestRoom.tags.map(tag => + { + return processAction('navigator_search_tag', tag) }>#{ tag } + }) } + } + + + processAction('set_home_room') } className={ 'flex-shrink-0 icon icon-house-small cursor-pointer' + classNames({ ' gray': homeRoomId !== roomInfoData.enteredGuestRoom.roomId }) } /> + dispatchUiEvent(new NavigatorEvent(NavigatorEvent.TOGGLE_ROOM_LINK)) } /> + { hasPermission('settings') && + <> + processAction('open_room_settings') } /> + processAction('open_floorplan_editor') } /> + } + + + { roomInfoData.enteredGuestRoom.description } + { (roomInfoData.enteredGuestRoom.habboGroupId > 0) && + processAction('open_group_info') }> + + + { LocalizeText('navigator.guildbase', ['groupName'], [roomInfoData.enteredGuestRoom.groupName]) } + + } + + + + { hasPermission('staff_pick') && + } + + { hasPermission('settings') && + } + + } + + + + ); +}; diff --git a/src/components/navigator/views/room-link/NavigatorRoomLinkView.scss b/src/components/navigator/views/room-link/NavigatorRoomLinkView.scss new file mode 100644 index 00000000..47a33189 --- /dev/null +++ b/src/components/navigator/views/room-link/NavigatorRoomLinkView.scss @@ -0,0 +1,3 @@ +.nitro-room-link { + width: 400px; +} diff --git a/src/views/navigator/views/room-link/NavigatorRoomLinkView.tsx b/src/components/navigator/views/room-link/NavigatorRoomLinkView.tsx similarity index 69% rename from src/views/navigator/views/room-link/NavigatorRoomLinkView.tsx rename to src/components/navigator/views/room-link/NavigatorRoomLinkView.tsx index ad06ffae..89f45b91 100644 --- a/src/views/navigator/views/room-link/NavigatorRoomLinkView.tsx +++ b/src/components/navigator/views/room-link/NavigatorRoomLinkView.tsx @@ -1,18 +1,24 @@ import { FC, useCallback, useEffect, useRef, useState } from 'react'; import { GetConfiguration, GetNitroInstance, LocalizeText } from '../../../../api'; +import { Column } from '../../../../common/Column'; +import { Flex } from '../../../../common/Flex'; +import { Text } from '../../../../common/Text'; import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../layout'; +import { RoomThumbnailView } from '../../../../layout/room-thumbnail/RoomThumbnailView'; import { useNavigatorContext } from '../../context/NavigatorContext'; -import { NavigatorRoomLinkViewProps } from './NavigatorRoomLinkView.types'; + +export class NavigatorRoomLinkViewProps +{ + onCloseClick: () => void; +} export const NavigatorRoomLinkView: FC = props => { const { onCloseClick = null } = props; - const { navigatorState = null } = useNavigatorContext(); - const { roomInfoData = null } = navigatorState; - const [ roomThumbnail, setRoomThumbnail ] = useState(null); const [ roomLink, setRoomLink ] = useState(null); - + const { navigatorState = null } = useNavigatorContext(); + const { roomInfoData = null } = navigatorState; const elementRef = useRef(); useEffect(() => @@ -50,18 +56,16 @@ export const NavigatorRoomLinkView: FC = props => return ( - processAction('close') } /> + -
-
- { roomThumbnail && } -
-
-
-
{ LocalizeText('navigator.embed.headline') }
-
{ LocalizeText('navigator.embed.info') }
- { roomLink && } -
+ + + + { LocalizeText('navigator.embed.headline') } + { LocalizeText('navigator.embed.info') } + { roomLink && } + +
); diff --git a/src/views/navigator/views/room-password/NavigatorRoomPasswordView.tsx b/src/components/navigator/views/room-password/NavigatorRoomPasswordView.tsx similarity index 100% rename from src/views/navigator/views/room-password/NavigatorRoomPasswordView.tsx rename to src/components/navigator/views/room-password/NavigatorRoomPasswordView.tsx diff --git a/src/views/navigator/views/room-password/NavigatorRoomPasswordView.types.ts b/src/components/navigator/views/room-password/NavigatorRoomPasswordView.types.ts similarity index 100% rename from src/views/navigator/views/room-password/NavigatorRoomPasswordView.types.ts rename to src/components/navigator/views/room-password/NavigatorRoomPasswordView.types.ts diff --git a/src/views/navigator/views/room-settings/NavigatorRoomSettingsView.scss b/src/components/navigator/views/room-settings/NavigatorRoomSettingsView.scss similarity index 94% rename from src/views/navigator/views/room-settings/NavigatorRoomSettingsView.scss rename to src/components/navigator/views/room-settings/NavigatorRoomSettingsView.scss index b8d49327..a136464b 100644 --- a/src/views/navigator/views/room-settings/NavigatorRoomSettingsView.scss +++ b/src/components/navigator/views/room-settings/NavigatorRoomSettingsView.scss @@ -1,10 +1,6 @@ .nitro-room-settings { width: 400px; - .content-area { - height: 350px; - } - .user-rights-container { .row { diff --git a/src/views/navigator/views/room-settings/NavigatorRoomSettingsView.tsx b/src/components/navigator/views/room-settings/NavigatorRoomSettingsView.tsx similarity index 96% rename from src/views/navigator/views/room-settings/NavigatorRoomSettingsView.tsx rename to src/components/navigator/views/room-settings/NavigatorRoomSettingsView.tsx index 8fe49ce2..aeac1985 100644 --- a/src/views/navigator/views/room-settings/NavigatorRoomSettingsView.tsx +++ b/src/components/navigator/views/room-settings/NavigatorRoomSettingsView.tsx @@ -135,15 +135,15 @@ export const NavigatorRoomSettingsView: FC<{}> = props => if(!roomSettingsData) return null; return ( - + processAction('close') } /> { TABS.map(tab => { - return setCurrentTab(tab) }>{ LocalizeText(tab) } + return setCurrentTab(tab) }>{ LocalizeText(tab) } }) } - + { currentTab === TABS[0] && } { currentTab === TABS[1] && } { currentTab === TABS[2] && } diff --git a/src/views/navigator/views/room-settings/NavigatorRoomSettingsView.types.ts b/src/components/navigator/views/room-settings/NavigatorRoomSettingsView.types.ts similarity index 100% rename from src/views/navigator/views/room-settings/NavigatorRoomSettingsView.types.ts rename to src/components/navigator/views/room-settings/NavigatorRoomSettingsView.types.ts diff --git a/src/components/navigator/views/room-settings/views/tab-access/NavigatorRoomSettingsAccessTabView.tsx b/src/components/navigator/views/room-settings/views/tab-access/NavigatorRoomSettingsAccessTabView.tsx new file mode 100644 index 00000000..f91fc26a --- /dev/null +++ b/src/components/navigator/views/room-settings/views/tab-access/NavigatorRoomSettingsAccessTabView.tsx @@ -0,0 +1,102 @@ +import { FC, useCallback } from 'react'; +import { LocalizeText } from '../../../../../../api'; +import { Column } from '../../../../../../common/Column'; +import { Flex } from '../../../../../../common/Flex'; +import { Text } from '../../../../../../common/Text'; +import { NavigatorRoomSettingsTabViewProps } from '../../NavigatorRoomSettingsView.types'; + +export const NavigatorRoomSettingsAccessTabView: FC = props => +{ + const { roomSettingsData = null, setRoomSettingsData = null, onSave = null } = props; + + const handleChange = useCallback((field: string, value: string | number | boolean) => + { + const roomSettings = Object.assign({}, roomSettingsData); + + let save = true; + + switch(field) + { + case 'lock_state': + roomSettings.lockState = Number(value); + + if(Number(value) === 3) save = false; + break; + case 'password': + roomSettings.password = String(value); + save = false; + break; + case 'confirm_password': + roomSettings.confirmPassword = String(value); + save = false; + break; + case 'allow_pets': + roomSettings.allowPets = Boolean(value); + break; + case 'allow_pets_eat': + roomSettings.allowPetsEat = Boolean(value); + break; + } + + setRoomSettingsData(roomSettings); + + if(save) onSave(roomSettings); + }, [ roomSettingsData, setRoomSettingsData, onSave ]); + + const isPasswordValid = useCallback(() => + { + return (roomSettingsData.password && (roomSettingsData.password.length > 0) && (roomSettingsData.password === roomSettingsData.confirmPassword)); + }, [ roomSettingsData ]); + + const trySave = useCallback(() => + { + if(isPasswordValid()) onSave(roomSettingsData); + }, [isPasswordValid, onSave, roomSettingsData]); + + return ( + <> + {LocalizeText('navigator.roomsettings.roomaccess.caption')} + { LocalizeText('navigator.roomsettings.roomaccess.info') } + + { LocalizeText('navigator.roomsettings.doormode') } + + handleChange('lock_state', 0) } /> + { LocalizeText('navigator.roomsettings.doormode.open') } + + + handleChange('lock_state', 1) } /> + { LocalizeText('navigator.roomsettings.doormode.doorbell') } + + + handleChange('lock_state', 2) } /> + { LocalizeText('navigator.roomsettings.doormode.invisible') } + + + handleChange('lock_state', 3) } /> + { (roomSettingsData.lockState !== 3) && { LocalizeText('navigator.roomsettings.doormode.password') } } + { roomSettingsData.lockState === 3 && + + { LocalizeText('navigator.roomsettings.doormode.password') } + handleChange('password', e.target.value) } onBlur={ trySave } placeholder={ LocalizeText('navigator.roomsettings.password') } /> + handleChange('confirm_password', e.target.value) } onBlur={ trySave } placeholder={ LocalizeText('navigator.roomsettings.passwordconfirm') } /> + { !isPasswordValid() && + + { LocalizeText('navigator.roomsettings.invalidconfirm') } + } + } + + + + { LocalizeText('navigator.roomsettings.pets') } + + handleChange('allow_pets', e.target.checked) } /> + { LocalizeText('navigator.roomsettings.allowpets') } + + + handleChange('allow_pets_eat', e.target.checked) } /> + { LocalizeText('navigator.roomsettings.allowfoodconsume') } + + + + ); +}; diff --git a/src/views/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx b/src/components/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx similarity index 67% rename from src/views/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx rename to src/components/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx index 64329cc1..cd1fd234 100644 --- a/src/views/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx +++ b/src/components/navigator/views/room-settings/views/tab-basic/NavigatorRoomSettingsBasicTabView.tsx @@ -1,9 +1,15 @@ +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FC, useCallback, useState } from 'react'; import { LocalizeText } from '../../../../../../api'; +import { Base } from '../../../../../../common/Base'; +import { Flex } from '../../../../../../common/Flex'; +import { Text } from '../../../../../../common/Text'; import { GetMaxVisitorsList } from '../../../../common/RoomSettingsUtils'; import { useNavigatorContext } from '../../../../context/NavigatorContext'; import { NavigatorRoomSettingsTabViewProps } from '../../NavigatorRoomSettingsView.types'; +const DESC_MAX_LENGTH = 255; + export const NavigatorRoomSettingsBasicTabView: FC = props => { const { roomSettingsData = null, setRoomSettingsData = null, onSave = null } = props; @@ -48,49 +54,49 @@ export const NavigatorRoomSettingsBasicTabView: FC -
- + + { LocalizeText('navigator.roomname') } handleChange('name', event.target.value) } onBlur={ () => onSave(roomSettingsData) } /> -
-
- - handleChange('description', event.target.value) } onBlur={ () => onSave(roomSettingsData) } /> -
-
- + + + { LocalizeText('navigator.roomsettings.desc') } +