diff --git a/src-web/components/RequestPane.tsx b/src-web/components/RequestPane.tsx index 4f0d4c41..2b538a34 100644 --- a/src-web/components/RequestPane.tsx +++ b/src-web/components/RequestPane.tsx @@ -19,6 +19,7 @@ import { useSendAnyHttpRequest } from '../hooks/useSendAnyHttpRequest'; import { useUpdateAnyHttpRequest } from '../hooks/useUpdateAnyHttpRequest'; import { deepEqualAtom } from '../lib/atoms'; import { languageFromContentType } from '../lib/contentType'; +import { fallbackRequestName } from '../lib/fallbackRequestName'; import { tryFormatJson } from '../lib/formatters'; import { generateId } from '../lib/generateId'; import { @@ -486,9 +487,10 @@ export const RequestPane = memo(function RequestPane({ hideLabel forceUpdateKey={forceUpdateKey} defaultValue={activeRequest.name} - className="font-sans !text-xl !px-0" + className="font-sans !text-xl" + inputWrapperClassName="!px-0" containerClassName="border-0" - placeholder="Request Name" + placeholder={fallbackRequestName(activeRequest)} onChange={(name) => updateRequest({ id: activeRequestId, update: { name } })} stateKey={`name.${activeRequest.id}`} /> diff --git a/src-web/components/Settings/SettingsAppearance.tsx b/src-web/components/Settings/SettingsAppearance.tsx index 125cd772..b8f8bb48 100644 --- a/src-web/components/Settings/SettingsAppearance.tsx +++ b/src-web/components/Settings/SettingsAppearance.tsx @@ -23,8 +23,12 @@ const fontSizeOptions = [ 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, ].map((n) => ({ label: `${n}`, value: `${n}` })); -const keymaps: EditorKeymap[] = ['default', 'vim', 'vscode', 'emacs']; -const keymapOptions = keymaps.map((n) => ({ label: n, value: n })); +const keymaps: { value: EditorKeymap; label: string }[] = [ + { value: 'default', label: 'Default' }, + { value: 'vim', label: 'Vim' }, + { value: 'vscode', label: 'VSCode' }, + { value: 'emacs', label: 'Emacs' }, +]; const buttonColors: ButtonProps['color'][] = [ 'primary', @@ -104,22 +108,22 @@ export function SettingsAppearance() { onChange={(v) => updateSettings.mutate({ editorFontSize: clamp(parseInt(v) || 14, 8, 30) })} event="editor-font-size" /> + updateSettings.mutate({ editorKeymap: v })} - event="editor-keymap" - /> diff --git a/src-web/components/core/Editor/Editor.css b/src-web/components/core/Editor/Editor.css index 69b27842..aab0fd6e 100644 --- a/src-web/components/core/Editor/Editor.css +++ b/src-web/components/core/Editor/Editor.css @@ -13,19 +13,20 @@ /* Vim-mode cursor */ .cm-fat-cursor { - @apply bg-text opacity-60; - } - - &.cm-focused { - outline: none !important; + @apply outline-0 bg-text !important; + @apply text-surface !important; } &:not(.cm-focused) { .cm-cursor, .cm-fat-cursor { - display: none; + @apply hidden; } } + &.cm-focused { + outline: none !important; + } + .cm-content { @apply py-0; } @@ -106,7 +107,7 @@ } .cm-line { - @apply px-2 overflow-hidden; + @apply overflow-hidden; } } diff --git a/src-web/components/core/Input.tsx b/src-web/components/core/Input.tsx index 54884f9e..86622a42 100644 --- a/src-web/components/core/Input.tsx +++ b/src-web/components/core/Input.tsx @@ -27,6 +27,7 @@ export type InputProps = Pick< labelPosition?: 'top' | 'left'; labelClassName?: string; containerClassName?: string; + inputWrapperClassName?: string; onChange?: (value: string) => void; onFocus?: () => void; onBlur?: () => void; @@ -48,6 +49,7 @@ export const Input = forwardRef(function Inp { className, containerClassName, + inputWrapperClassName, defaultValue, forceUpdateKey, hideLabel, @@ -161,7 +163,8 @@ export const Input = forwardRef(function Inp {leftSlot}