Merge branch 'hotkeys-statuses' into 'develop'

Move GlobalHotkeys back to features/ui for now

See merge request soapbox-pub/soapbox!2593
This commit is contained in:
marcin mikołajczak 2023-07-03 12:32:07 +00:00
commit 72de8fb90f
3 changed files with 73 additions and 72 deletions

View file

@ -29,7 +29,6 @@ import {
OnboardingWizard,
WaitlistPage,
} from 'soapbox/features/ui/util/async-components';
import GlobalHotkeys from 'soapbox/features/ui/util/global-hotkeys';
import { createGlobals } from 'soapbox/globals';
import {
useAppSelector,
@ -176,7 +175,6 @@ const SoapboxMount = () => {
<BrowserRouter basename={BuildConfig.FE_SUBDIRECTORY}>
<CompatRouter>
<ScrollContext shouldUpdateScroll={shouldUpdateScroll}>
<GlobalHotkeys>
<Switch>
<Route
path='/embed/:statusId'
@ -202,7 +200,6 @@ const SoapboxMount = () => {
</div>
</Route>
</Switch>
</GlobalHotkeys>
</ScrollContext>
</CompatRouter>
</BrowserRouter>

View file

@ -135,6 +135,7 @@ import {
EditGroup,
FollowedTags,
} from './util/async-components';
import GlobalHotkeys from './util/global-hotkeys';
import { WrappedRoute } from './util/react-router-helpers';
// Dummy import, to make sure that <Status /> ends up in the application bundle.
@ -511,6 +512,7 @@ const UI: React.FC<IUI> = ({ children }) => {
};
return (
<GlobalHotkeys node={node}>
<div ref={node} style={style}>
<div
className={clsx('pointer-events-none fixed z-[90] h-screen w-screen transition', {
@ -565,6 +567,7 @@ const UI: React.FC<IUI> = ({ children }) => {
</BundleContainer>
</div>
</div>
</GlobalHotkeys>
);
};

View file

@ -36,9 +36,10 @@ const keyMap = {
interface IGlobalHotkeys {
children: React.ReactNode
node: React.MutableRefObject<HTMLDivElement | null>
}
const GlobalHotkeys: React.FC<IGlobalHotkeys> = ({ children }) => {
const GlobalHotkeys: React.FC<IGlobalHotkeys> = ({ children, node }) => {
const hotkeys = useRef<HTMLDivElement | null>(null);
const history = useHistory();
@ -48,9 +49,9 @@ const GlobalHotkeys: React.FC<IGlobalHotkeys> = ({ children }) => {
const handleHotkeyNew = (e?: KeyboardEvent) => {
e?.preventDefault();
if (!hotkeys.current) return;
if (!node.current) return;
const element = hotkeys.current.querySelector('textarea#compose-textarea') as HTMLTextAreaElement;
const element = node.current.querySelector('textarea#compose-textarea') as HTMLTextAreaElement;
if (element) {
element.focus();
@ -59,9 +60,9 @@ const GlobalHotkeys: React.FC<IGlobalHotkeys> = ({ children }) => {
const handleHotkeySearch = (e?: KeyboardEvent) => {
e?.preventDefault();
if (!hotkeys.current) return;
if (!node.current) return;
const element = hotkeys.current.querySelector('input#search') as HTMLInputElement;
const element = node.current.querySelector('input#search') as HTMLInputElement;
if (element) {
element.focus();