Tweak recent requests

This commit is contained in:
Gregory Schier
2023-04-09 22:25:00 -07:00
parent efc4e3bf6c
commit e85dd32005

View File

@@ -1,5 +1,5 @@
import { useMemo, useRef } from 'react'; import { useMemo, useRef } from 'react';
import { useKeyPressEvent } from 'react-use'; import { useKey, useKeyPressEvent } from 'react-use';
import { useActiveRequest } from '../hooks/useActiveRequest'; import { useActiveRequest } from '../hooks/useActiveRequest';
import { useActiveWorkspaceId } from '../hooks/useActiveWorkspaceId'; import { useActiveWorkspaceId } from '../hooks/useActiveWorkspaceId';
import { useAppRoutes } from '../hooks/useAppRoutes'; import { useAppRoutes } from '../hooks/useAppRoutes';
@@ -12,31 +12,33 @@ import { Dropdown } from './core/Dropdown';
export function RecentRequestsDropdown() { export function RecentRequestsDropdown() {
const dropdownRef = useRef<DropdownRef>(null); const dropdownRef = useRef<DropdownRef>(null);
const activeRequest = useActiveRequest();
const activeWorkspaceId = useActiveWorkspaceId();
const recentRequestIds = useRecentRequests();
const requests = useRequests();
const routes = useAppRoutes();
useKeyPressEvent('Control', undefined, () => { useKeyPressEvent('Control', undefined, () => {
// Key up // Key up
dropdownRef.current?.select?.(); dropdownRef.current?.select?.();
}); });
useKeyPressEvent('Tab', (e) => { useKey(
if (!e.ctrlKey) return; 'Tab',
if (!dropdownRef.current?.isOpen) { (e) => {
// Set to 1 because the first item is the active request if (!e.ctrlKey || recentRequestIds.length === 0) return;
dropdownRef.current?.open(e.shiftKey ? -1 : 0);
}
if (e.shiftKey) { if (!dropdownRef.current?.isOpen) {
dropdownRef.current?.prev?.(); // Set to 1 because the first item is the active request
} else { dropdownRef.current?.open(e.shiftKey ? -1 : 0);
dropdownRef.current?.next?.(); }
}
});
const activeRequest = useActiveRequest(); if (e.shiftKey) dropdownRef.current?.prev?.();
const activeWorkspaceId = useActiveWorkspaceId(); else dropdownRef.current?.next?.();
const recentRequestIds = useRecentRequests(); },
const requests = useRequests(); undefined,
const routes = useAppRoutes(); [recentRequestIds.length],
);
const items = useMemo<DropdownItem[]>(() => { const items = useMemo<DropdownItem[]>(() => {
if (activeWorkspaceId === null) return []; if (activeWorkspaceId === null) return [];
@@ -72,7 +74,7 @@ export function RecentRequestsDropdown() {
size="sm" size="sm"
className="pointer-events-auto flex-[2] text-center text-gray-800 text-sm truncate pointer-events-none" className="pointer-events-auto flex-[2] text-center text-gray-800 text-sm truncate pointer-events-none"
> >
{activeRequest?.name} {activeRequest?.name ?? <span className="text-gray-400">No Request</span>}
</Button> </Button>
</Dropdown> </Dropdown>
); );