diff --git a/src-web/components/HttpAuthenticationEditor.tsx b/src-web/components/HttpAuthenticationEditor.tsx index 611cdd4d..e3cac026 100644 --- a/src-web/components/HttpAuthenticationEditor.tsx +++ b/src-web/components/HttpAuthenticationEditor.tsx @@ -19,7 +19,7 @@ interface Props { export function HttpAuthenticationEditor({ request }: Props) { const updateHttpRequest = useUpdateAnyHttpRequest(); const updateGrpcRequest = useUpdateAnyGrpcRequest(); - const auth = useHttpAuthenticationConfig( + const authConfig = useHttpAuthenticationConfig( request.authenticationType, request.authentication, request.id, @@ -43,7 +43,7 @@ export function HttpAuthenticationEditor({ request }: Props) { [request.id, request.model, updateGrpcRequest, updateHttpRequest], ); - if (auth.data == null) { + if (authConfig.data == null) { return No Authentication {request.authenticationType}; } @@ -56,9 +56,9 @@ export function HttpAuthenticationEditor({ request }: Props) { onChange={(disabled) => handleChange({ ...request.authentication, disabled: !disabled })} title="Enabled" /> - {auth.data.actions && ( + {authConfig.data.actions && ( ({ label: a.label, leftSlot: a.icon ? : null, @@ -75,7 +75,7 @@ export function HttpAuthenticationEditor({ request }: Props) { autocompleteVariables useTemplating stateKey={`auth.${request.id}.${request.authenticationType}`} - inputs={auth.data.args} + inputs={authConfig.data.args} data={request.authentication} onChange={handleChange} /> diff --git a/src-web/components/RecentRequestsDropdown.tsx b/src-web/components/RecentRequestsDropdown.tsx index dc09e62d..5d10a0ce 100644 --- a/src-web/components/RecentRequestsDropdown.tsx +++ b/src-web/components/RecentRequestsDropdown.tsx @@ -59,8 +59,7 @@ export function RecentRequestsDropdown({ className }: Props) { recentRequestItems.push({ label: fallbackRequestName(request), - // leftSlot: , - leftSlot: , + leftSlot: , onSelect: async () => { await router.navigate({ to: '/workspaces/$workspaceId', diff --git a/src-web/components/SidebarItem.tsx b/src-web/components/SidebarItem.tsx index d8d1b398..4823d9a4 100644 --- a/src-web/components/SidebarItem.tsx +++ b/src-web/components/SidebarItem.tsx @@ -217,7 +217,6 @@ export const SidebarItem = memo(function SidebarItem({ const itemPrefix = (item.model === 'http_request' || item.model === 'grpc_request') && ( @@ -272,7 +271,7 @@ export const SidebarItem = memo(function SidebarItem({ onKeyDown={handleInputKeyDown} /> ) : ( - {itemName} +
{itemName}
)} {latestGrpcConnection ? ( diff --git a/src-web/components/core/HttpMethodTag.tsx b/src-web/components/core/HttpMethodTag.tsx index 53b71c94..55a24f5e 100644 --- a/src-web/components/core/HttpMethodTag.tsx +++ b/src-web/components/core/HttpMethodTag.tsx @@ -1,5 +1,5 @@ -import classNames from 'classnames'; import type { GrpcRequest, HttpRequest } from '@yaakapp-internal/models'; +import classNames from 'classnames'; interface Props { request: HttpRequest | GrpcRequest; @@ -7,46 +7,34 @@ interface Props { shortNames?: boolean; } -const longMethodMap = { - get: 'GET', - put: 'PUT', +const methodNames: Record = { + get: ' GET', + put: ' PUT', post: 'POST', - patch: 'PATCH', - delete: 'DELETE', - options: 'OPTIONS', + patch: 'PTCH', + delete: 'DELE', + options: 'OPTN', head: 'HEAD', -} as const; - -const shortMethodMap: Record = { - get: 'GET', - put: 'PUT', - post: 'PST', - patch: 'PTC', - delete: 'DEL', - options: 'OPT', - head: 'HED', + query: 'QURY', }; -export function HttpMethodTag({ shortNames, request, className }: Props) { +export function HttpMethodTag({ request, className }: Props) { const method = request.model === 'http_request' && request.bodyType === 'graphql' ? 'GQL' : request.model === 'grpc_request' - ? 'GRP' + ? 'GRPC' : request.method; - const m = method.toLowerCase(); - const methodMap: Record = shortNames ? shortMethodMap : longMethodMap; return ( - {methodMap[m] ?? m.slice(0, 4).toUpperCase()} + {(methodNames[method.toLowerCase()] ?? method.slice(0, 4)).toUpperCase()} ); } diff --git a/src-web/hooks/useHttpAuthenticationConfig.ts b/src-web/hooks/useHttpAuthenticationConfig.ts index 1c06f668..0d0a8833 100644 --- a/src-web/hooks/useHttpAuthenticationConfig.ts +++ b/src-web/hooks/useHttpAuthenticationConfig.ts @@ -24,9 +24,17 @@ export function useHttpAuthenticationConfig( ); return useQuery({ - queryKey: ['http_authentication_config', requestId, authName, values, responseKey, forceRefreshCounter], + queryKey: [ + 'http_authentication_config', + requestId, + authName, + values, + responseKey, + forceRefreshCounter, + ], placeholderData: (prev) => prev, // Keep previous data on refetch queryFn: async () => { + if (authName == null) return null; const config = await invokeCmd( 'cmd_get_http_authentication_config', {