Headers
@@ -198,7 +204,7 @@ export const RequestPane = memo(function RequestPane({
),
},
{
- value: 'auth',
+ value: TAB_AUTH,
label: 'Auth',
options: {
value: activeRequest.authenticationType,
@@ -292,6 +298,10 @@ export const RequestPane = memo(function RequestPane({
const { updateKey } = useRequestUpdateKey(activeRequestId ?? null);
const importCurl = useImportCurl();
+ useOnFocusParamsTab(() => {
+ setActiveTab(TAB_PARAMS);
+ });
+
return (
(null);
+
+ useOnFocusParamValue(
+ (name) => {
+ const pairIndex = pairs.findIndex((p) => p.name === name);
+ if (pairIndex >= 0) {
+ pairEditor.current?.focusValue(pairIndex);
+ } else {
+ console.log("Couldn't find pair to focus", { name, pairs });
+ }
+ },
+ [pairs],
+ );
+
return (
(function E
[dialog],
);
- const onClickPathParameter = useCallback(async (name: string) => {
- console.log('TODO: Focus', name, 'in params tab');
- }, []);
+ const { focusParamValue } = useRequestEditor();
+ const onClickPathParameter = useCallback(
+ async (name: string) => {
+ focusParamValue(name);
+ },
+ [focusParamValue],
+ );
// Update the language extension when the language changes
useEffect(() => {
diff --git a/src-web/components/core/Editor/twig/templateTags.ts b/src-web/components/core/Editor/twig/templateTags.ts
index d5a348a0..962b441a 100644
--- a/src-web/components/core/Editor/twig/templateTags.ts
+++ b/src-web/components/core/Editor/twig/templateTags.ts
@@ -120,7 +120,6 @@ function templateTags(
const onClick = () => onClickPathParameter(rawText);
const widget = new PathPlaceholderWidget(rawText, globalFrom, onClick);
const deco = Decoration.replace({ widget, inclusive: false });
- console.log('ADDED WIDGET', globalFrom, node, rawText);
widgets.push(deco.range(globalFrom, globalTo));
},
});
@@ -201,13 +200,6 @@ export function templateTagsPlugin(
return view.plugin(plugin)?.decorations || Decoration.none;
});
},
- eventHandlers: {
- mousedown(e) {
- const target = e.target as HTMLElement;
- if (target.classList.contains('template-tag')) console.log('CLICKED TEMPLATE TAG');
- // return toggleBoolean(view, view.posAtDOM(target));
- },
- },
},
);
}
diff --git a/src-web/components/core/Editor/url/highlight.ts b/src-web/components/core/Editor/url/highlight.ts
index 8b96f6de..e908323f 100644
--- a/src-web/components/core/Editor/url/highlight.ts
+++ b/src-web/components/core/Editor/url/highlight.ts
@@ -3,9 +3,9 @@ import { styleTags, tags as t } from '@lezer/highlight';
export const highlight = styleTags({
Protocol: t.comment,
Placeholder: t.emphasis,
- PathSegment: t.tagName,
- Port: t.attributeName,
- Host: t.variableName,
- Path: t.bool,
- Query: t.string,
+ // PathSegment: t.tagName,
+ // Port: t.attributeName,
+ // Host: t.variableName,
+ // Path: t.bool,
+ // Query: t.string,
});
diff --git a/src-web/components/core/PairEditor.tsx b/src-web/components/core/PairEditor.tsx
index 91a29aff..8ff6a275 100644
--- a/src-web/components/core/PairEditor.tsx
+++ b/src-web/components/core/PairEditor.tsx
@@ -1,6 +1,15 @@
import classNames from 'classnames';
import type { EditorView } from 'codemirror';
-import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import {
+ Fragment,
+ forwardRef,
+ useCallback,
+ useEffect,
+ useImperativeHandle,
+ useMemo,
+ useRef,
+ useState,
+} from 'react';
import type { XYCoord } from 'react-dnd';
import { useDrag, useDrop } from 'react-dnd';
import { v4 as uuid } from 'uuid';
@@ -16,6 +25,10 @@ import type { InputProps } from './Input';
import { Input } from './Input';
import { RadioDropdown } from './RadioDropdown';
+export interface PairEditorRef {
+ focusValue(index: number): void;
+}
+
export type PairEditorProps = {
pairs: Pair[];
onChange: (pairs: Pair[]) => void;
@@ -49,24 +62,28 @@ type PairContainer = {
id: string;
};
-export function PairEditor({
- className,
- forceUpdateKey,
- nameAutocomplete,
- nameAutocompleteVariables,
- namePlaceholder,
- nameValidate,
- valueType,
- onChange,
- noScroll,
- pairs: originalPairs,
- valueAutocomplete,
- valueAutocompleteVariables,
- valuePlaceholder,
- valueValidate,
- allowFileValues,
-}: PairEditorProps) {
- const [forceFocusPairId, setForceFocusPairId] = useState(null);
+export const PairEditor = forwardRef(function PairEditor(
+ {
+ className,
+ forceUpdateKey,
+ nameAutocomplete,
+ nameAutocompleteVariables,
+ namePlaceholder,
+ nameValidate,
+ valueType,
+ onChange,
+ noScroll,
+ pairs: originalPairs,
+ valueAutocomplete,
+ valueAutocompleteVariables,
+ valuePlaceholder,
+ valueValidate,
+ allowFileValues,
+ }: PairEditorProps,
+ ref,
+) {
+ const [forceFocusNamePairId, setForceFocusNamePairId] = useState(null);
+ const [forceFocusValuePairId, setForceFocusValuePairId] = useState(null);
const [hoveredIndex, setHoveredIndex] = useState(null);
const [pairs, setPairs] = useState(() => {
// Remove empty headers on initial render
@@ -75,6 +92,13 @@ export function PairEditor({
return [...pairs, newPairContainer()];
});
+ useImperativeHandle(ref, () => ({
+ focusValue(index: number) {
+ const id = pairs[index]?.id ?? 'n/a';
+ setForceFocusValuePairId(id);
+ },
+ }));
+
useEffect(() => {
// Remove empty headers on initial render
// TODO: Make this not refresh the entire editor when forceUpdateKey changes, using some
@@ -135,17 +159,18 @@ export function PairEditor({
if (focusPrevious) {
const index = pairs.findIndex((p) => p.id === pair.id);
const id = pairs[index - 1]?.id ?? null;
- setForceFocusPairId(id);
+ setForceFocusNamePairId(id);
}
return setPairsAndSave((oldPairs) => oldPairs.filter((p) => p.id !== pair.id));
},
- [setPairsAndSave, setForceFocusPairId, pairs],
+ [setPairsAndSave, setForceFocusNamePairId, pairs],
);
const handleFocus = useCallback(
(pair: PairContainer) =>
setPairs((pairs) => {
- setForceFocusPairId(null); // Remove focus override when something focused
+ setForceFocusNamePairId(null); // Remove focus override when something focused
+ setForceFocusValuePairId(null); // Remove focus override when something focused
const isLast = pair.id === pairs[pairs.length - 1]?.id;
return isLast ? [...pairs, newPairContainer()] : pairs;
}),
@@ -185,7 +210,8 @@ export function PairEditor({
nameAutocompleteVariables={nameAutocompleteVariables}
valueAutocompleteVariables={valueAutocompleteVariables}
valueType={valueType}
- forceFocusPairId={forceFocusPairId}
+ forceFocusNamePairId={forceFocusNamePairId}
+ forceFocusValuePairId={forceFocusValuePairId}
forceUpdateKey={forceUpdateKey}
nameAutocomplete={nameAutocomplete}
valueAutocomplete={valueAutocomplete}
@@ -204,7 +230,7 @@ export function PairEditor({
})}
);
-}
+});
enum ItemTypes {
ROW = 'pair-row',
@@ -213,7 +239,8 @@ enum ItemTypes {
type PairEditorRowProps = {
className?: string;
pairContainer: PairContainer;
- forceFocusPairId?: string | null;
+ forceFocusNamePairId?: string | null;
+ forceFocusValuePairId?: string | null;
onMove: (id: string, side: 'above' | 'below') => void;
onEnd: (id: string) => void;
onChange: (pair: PairContainer) => void;
@@ -239,7 +266,8 @@ type PairEditorRowProps = {
function PairEditorRow({
allowFileValues,
className,
- forceFocusPairId,
+ forceFocusNamePairId,
+ forceFocusValuePairId,
forceUpdateKey,
isLast,
nameAutocomplete,
@@ -262,12 +290,19 @@ function PairEditorRow({
const ref = useRef
(null);
const prompt = usePrompt();
const nameInputRef = useRef(null);
+ const valueInputRef = useRef(null);
useEffect(() => {
- if (forceFocusPairId === pairContainer.id) {
+ if (forceFocusNamePairId === pairContainer.id) {
nameInputRef.current?.focus();
}
- }, [forceFocusPairId, pairContainer.id]);
+ }, [forceFocusNamePairId, pairContainer.id]);
+
+ useEffect(() => {
+ if (forceFocusValuePairId === pairContainer.id) {
+ valueInputRef.current?.focus();
+ }
+ }, [forceFocusValuePairId, pairContainer.id]);
const handleChangeEnabled = useMemo(
() => (enabled: boolean) => onChange({ id, pair: { ...pairContainer.pair, enabled } }),
@@ -400,6 +435,7 @@ function PairEditorRow({
/>
) : (
({
namespace: 'global',
key: ['bulk_edit', preferenceName],
@@ -18,7 +22,7 @@ export function PairOrBulkEditor({ preferenceName, ...props }: Props) {
return (
- {useBulk ?
:
}
+ {useBulk ?
:
}
);
-}
+});
diff --git a/src-web/main.tsx b/src-web/main.tsx
index 5960bc0a..90190633 100644
--- a/src-web/main.tsx
+++ b/src-web/main.tsx
@@ -1,5 +1,4 @@
import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow';
-import { attachConsole } from '@tauri-apps/plugin-log';
import { type } from '@tauri-apps/plugin-os';
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
@@ -18,8 +17,6 @@ if (osType !== 'macos') {
await getCurrentWebviewWindow().setDecorations(false);
}
-await attachConsole();
-
window.addEventListener('keydown', (e) => {
// Hack to not go back in history on backspace. Check for document body
// or else it will prevent backspace in input fields.