mirror of
https://github.com/billsonnn/nitro-react.git
synced 2024-11-26 15:40:51 +01:00
Context Fix
This commit is contained in:
parent
0134b12b9e
commit
0ffb6b0d47
@ -140,7 +140,7 @@ export function NavigatorView(props: NavigatorViewProps): JSX.Element
|
||||
</button>
|
||||
</div>
|
||||
<NavigatorTabsView topLevelContext={ topLevelContext } topLevelContexts={ topLevelContexts } setTopLevelContext={ setTopLevelContext } />
|
||||
<TransitionAnimation className="d-flex px-3 pb-3" type={ TransitionAnimationTypes.FADE_IN } inProp={ (!isSearching && !!searchResults) } timeout={ 300 }>
|
||||
<TransitionAnimation className="d-flex px-3 pb-3" type={ TransitionAnimationTypes.FADE_IN } inProp={ (!isSearching && !!searchResults) } timeout={ 200 }>
|
||||
<NavigatorResultListsView resultLists={ searchResults } />
|
||||
</TransitionAnimation>
|
||||
</div>
|
||||
|
@ -15,7 +15,6 @@ export function NavigatorLockView(props: NavigatorLockViewProps): JSX.Element
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<DraggableWindow handle=".drag-handler">
|
||||
<div className="nitro-navigator-lock d-flex flex-column bg-primary border border-black shadow rounded position-absolute">
|
||||
<div className="drag-handler d-flex justify-content-between align-items-center px-3 pt-3">
|
||||
@ -32,7 +31,6 @@ export function NavigatorLockView(props: NavigatorLockViewProps): JSX.Element
|
||||
</> }
|
||||
</div>
|
||||
</div>
|
||||
</DraggableWindow>
|
||||
</>
|
||||
</DraggableWindow>
|
||||
);
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import classNames from 'classnames';
|
||||
import { RoomDataParser } from 'nitro-renderer';
|
||||
import React from 'react';
|
||||
import React, { useContext } from 'react';
|
||||
import { NavigatorContext } from '../../../NavigatorView';
|
||||
import { NavigatorResultViewProps } from './NavigatorResultView.types';
|
||||
|
||||
@ -8,6 +8,8 @@ export function NavigatorResultView(props: NavigatorResultViewProps): JSX.Elemen
|
||||
{
|
||||
const { result = null } = props;
|
||||
|
||||
const navigatorContext = useContext(NavigatorContext);
|
||||
|
||||
function getUserCounterColor(): string
|
||||
{
|
||||
const num: number = (100 * (result.userCount / result.maxUserCount));
|
||||
@ -37,28 +39,24 @@ export function NavigatorResultView(props: NavigatorResultViewProps): JSX.Elemen
|
||||
}
|
||||
|
||||
return (
|
||||
<NavigatorContext.Consumer>
|
||||
{ navigatorContext => {
|
||||
return <div className="d-flex flex-column justify-content-center align-items-center nitro-navigator-result" onClick={ () => navigatorContext.onTryVisitRoom(result) }>
|
||||
<div className="d-flex justify-content-between w-100 px-2 py-1">
|
||||
<div className="d-flex justify-content-center flex-grow-1 overflow-hidden">
|
||||
<div className={ "d-flex justify-content-center align-items-center badge text-center " + getUserCounterColor() }>
|
||||
<i className="fas fa-user mr-1 small"></i> { result.userCount }
|
||||
</div>
|
||||
<div className="d-flex flex-column justify-content-center align-items-start flex-grow-1 px-2 overflow-hidden">
|
||||
<span className="d-block text-truncate" style={ { maxWidth: '95%' } }>{ result.roomName }</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-flex flex-row-reverse align-items-center">
|
||||
<i className="fas fa-info-circle small" onClick={ openInfo }></i>
|
||||
{ result.habboGroupId > 0 && <i className="fas fa-users mr-2 small"></i> }
|
||||
{ result.doorMode !== RoomDataParser.OPEN_STATE &&
|
||||
<i className={ "mr-2 fas small" + classNames( {'fa-lock': result.doorMode === RoomDataParser.DOORBELL_STATE, 'fa-key': result.doorMode === RoomDataParser.PASSWORD_STATE })}></i>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-flex flex-column justify-content-center align-items-center nitro-navigator-result" onClick={ () => navigatorContext.onTryVisitRoom(result) }>
|
||||
<div className="d-flex justify-content-between w-100 px-2 py-1">
|
||||
<div className="d-flex justify-content-center flex-grow-1 overflow-hidden">
|
||||
<div className={ "d-flex justify-content-center align-items-center badge text-center " + getUserCounterColor() }>
|
||||
<i className="fas fa-user mr-1 small"></i> { result.userCount }
|
||||
</div>
|
||||
}}
|
||||
</NavigatorContext.Consumer>
|
||||
<div className="d-flex flex-column justify-content-center align-items-start flex-grow-1 px-2 overflow-hidden">
|
||||
<span className="d-block text-truncate" style={ { maxWidth: '95%' } }>{ result.roomName }</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-flex flex-row-reverse align-items-center">
|
||||
<i className="fas fa-info-circle small" onClick={ openInfo }></i>
|
||||
{ result.habboGroupId > 0 && <i className="fas fa-users mr-2 small"></i> }
|
||||
{ result.doorMode !== RoomDataParser.OPEN_STATE &&
|
||||
<i className={ 'mr-2 fas small ' + classNames( {'fa-lock': result.doorMode === RoomDataParser.DOORBELL_STATE, 'fa-key': result.doorMode === RoomDataParser.PASSWORD_STATE })}></i>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user