starred/yaak
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-23 18:01:21 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Improve copy-as-curl

Browse Source
This commit is contained in:
Gregory Schier
2024-05-13 11:30:10 -07:00
parent b640f0c357
commit cb1c6a4d8c
21 changed files with 189 additions and 235 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/importer-curl/src/index.ts
View File

@@ -137,8 +137,6 @@ export function importCommand(parseEntries: ParseEntry[], workspaceId: string) {
// Start at 1 so we can skip the ^curl part
for (let i = 1; i < parseEntries.length; i++) {
let parseEntry = parseEntries[i];
// trim leading spaces between parsed entries
// regex won't match otherwise (e.g. -H 'Content-Type: application/json')
if (typeof parseEntry === 'string') {
parseEntry = parseEntry.trim();
}

125
src-tauri/Cargo.lock generated
View File

@@ -1051,16 +1051,6 @@ dependencies = [
"version_check 0.9.4",
]
[[package]]
name = "cookie"
version = "0.18.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "3cd91cf61412820176e137621345ee43b3f4423e589e7ae4e50d601d93e35ef8"
dependencies = [
"time",
"version_check 0.9.4",
]
[[package]]
name = "cookie_store"
version = "0.16.2"
@@ -1830,26 +1820,11 @@ dependencies = [
"new_debug_unreachable",
]
[[package]]
name = "futures"
version = "0.3.29"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "da0290714b38af9b4a7b094b8a37086d1b4e61f2df9122c3cad2577669145335"
dependencies = [
"futures-channel",
"futures-core",
"futures-executor",
"futures-io",
"futures-sink",
"futures-task",
"futures-util",
]
[[package]]
name = "futures-channel"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ff4dd66668b557604244583e3e1e1eada8c5c2e96a6d0d6653ede395b78bbacb"
checksum = "eac8f7d7865dcb88bd4373ab671c8cf4508703796caa2b1985a9ca867b3fcb78"
dependencies = [
"futures-core",
"futures-sink",
@@ -1857,15 +1832,15 @@ dependencies = [
[[package]]
name = "futures-core"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "eb1d22c66e66d9d72e1758f0bd7d4fd0bee04cad842ee34587d68c07e45d088c"
checksum = "dfc6580bb841c5a68e9ef15c77ccc837b40a7504914d52e47b8b0e9bbda25a1d"
[[package]]
name = "futures-executor"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0f4fb8693db0cf099eadcca0efe2a5a22e4550f98ed16aba6c48700da29597bc"
checksum = "a576fc72ae164fca6b9db127eaa9a9dda0d61316034f33a0a0d4eda41f02b01d"
dependencies = [
"futures-core",
"futures-task",
@@ -1885,9 +1860,9 @@ dependencies = [
[[package]]
name = "futures-io"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8bf34a163b5c4c52d0478a4d757da8fb65cabef42ba90515efee0f6f9fa45aaa"
checksum = "a44623e20b9681a318efdd71c299b6b222ed6f231972bfe2f224ebad6311f0c1"
[[package]]
name = "futures-lite"
@@ -1904,9 +1879,9 @@ dependencies = [
[[package]]
name = "futures-macro"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "53b153fd91e4b0147f4aced87be237c98248656bb01050b96bf3ee89220a8ddb"
checksum = "87750cf4b7a4c0625b1529e4c543c2182106e4dedc60a2a6455e00d212c489ac"
dependencies = [
"proc-macro2",
"quote",
@@ -1915,23 +1890,22 @@ dependencies = [
[[package]]
name = "futures-sink"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e36d3378ee38c2a36ad710c5d30c2911d752cb941c00c72dbabfb786a7970817"
checksum = "9fb8e00e87438d937621c1c6269e53f536c14d3fbd6a042bb24879e57d474fb5"
[[package]]
name = "futures-task"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "efd193069b0ddadc69c46389b740bbccdd97203899b48d09c5f7969591d6bae2"
checksum = "38d84fa142264698cdce1a9f9172cf383a0c82de1bddcf3092901442c4097004"
[[package]]
name = "futures-util"
version = "0.3.29"
version = "0.3.30"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "a19526d624e703a3179b3d322efec918b6246ea0fa51d41124525f00f1cc8104"
checksum = "3d6401deb83407ab3da39eba7e33987a73c3df0c82b4bb5813ee871c19c41d48"
dependencies = [
"futures-channel",
"futures-core",
"futures-io",
"futures-macro",
@@ -2226,11 +2200,9 @@ dependencies = [
"hyper 0.14.27",
"hyper-rustls 0.24.2",
"log",
"once_cell",
"prost",
"prost-reflect",
"prost-types",
"protoc-bin-vendored",
"serde",
"serde_json",
"tauri",
@@ -4321,56 +4293,6 @@ dependencies = [
"prost",
]
[[package]]
name = "protoc-bin-vendored"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "005ca8623e5633e298ad1f917d8be0a44bcf406bf3cde3b80e63003e49a3f27d"
dependencies = [
"protoc-bin-vendored-linux-aarch_64",
"protoc-bin-vendored-linux-ppcle_64",
"protoc-bin-vendored-linux-x86_32",
"protoc-bin-vendored-linux-x86_64",
"protoc-bin-vendored-macos-x86_64",
"protoc-bin-vendored-win32",
]
[[package]]
name = "protoc-bin-vendored-linux-aarch_64"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8fb9fc9cce84c8694b6ea01cc6296617b288b703719b725b8c9c65f7c5874435"
[[package]]
name = "protoc-bin-vendored-linux-ppcle_64"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "02d2a07dcf7173a04d49974930ccbfb7fd4d74df30ecfc8762cf2f895a094516"
[[package]]
name = "protoc-bin-vendored-linux-x86_32"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "d54fef0b04fcacba64d1d80eed74a20356d96847da8497a59b0a0a436c9165b0"
[[package]]
name = "protoc-bin-vendored-linux-x86_64"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b8782f2ce7d43a9a5c74ea4936f001e9e8442205c244f7a3d4286bd4c37bc924"
[[package]]
name = "protoc-bin-vendored-macos-x86_64"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b5de656c7ee83f08e0ae5b81792ccfdc1d04e7876b1d9a38e6876a9e09e02537"
[[package]]
name = "protoc-bin-vendored-win32"
version = "3.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9653c3ed92974e34c5a6e0a510864dab979760481714c172e0a34e437cb98804"
[[package]]
name = "psl-types"
version = "2.0.11"
@@ -7251,18 +7173,6 @@ version = "0.4.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f"
[[package]]
name = "window-shadows"
version = "0.2.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "67ff424735b1ac21293b0492b069394b0a189c8a463fb015a16dea7c2e221c08"
dependencies = [
"cocoa",
"objc",
"raw-window-handle 0.5.2",
"windows-sys 0.48.0",
]
[[package]]
name = "window-vibrancy"
version = "0.5.0"
@@ -7731,9 +7641,7 @@ dependencies = [
"boa_runtime",
"chrono",
"cocoa",
"cookie 0.18.0",
"datetime",
"futures",
"grpc",
"http 0.2.10",
"log",
@@ -7759,7 +7667,6 @@ dependencies = [
"tokio",
"tokio-stream",
"uuid",
"window-shadows",
]
[[package]]

17
src-tauri/Cargo.toml
View File

@@ -3,10 +3,6 @@ workspace = { members = ["grpc"] }
[package]
name = "yaak-app"
version = "0.0.0"
description = "A network protocol testing utility app"
authors = ["Gregory Schier"]
license = "MIT"
repository = "https://github.com/gschier/yaak-app"
edition = "2021"
# Produce a library for mobile support
@@ -32,13 +28,11 @@ base64 = "0.22.0"
boa_engine = { version = "0.18.0", features = ["annex-b"] }
boa_runtime = { version = "0.18.0" }
chrono = { version = "0.4.31", features = ["serde"] }
futures = "0.3.26"
http = "0.2.8"
http = "0.2.10"
rand = "0.8.5"
reqwest = { version = "0.11.23", features = ["multipart", "cookies", "gzip", "brotli", "deflate"] }
cookie = { version = "0.18.0" }
serde = { version = "1.0.195", features = ["derive"] }
serde_json = { version = "1.0.111", features = ["raw_value"] }
serde = { version = "1.0.198", features = ["derive"] }
serde_json = { version = "1.0.116", features = ["raw_value"] }
sqlx = { version = "0.7.4", features = ["sqlite", "runtime-tokio-rustls", "json", "chrono", "time"] }
tauri = { version = "2.0.0-beta.17", features = [
"config-toml",
@@ -53,10 +47,9 @@ tauri-plugin-updater = { git = "https://github.com/tauri-apps/plugins-workspace"
tauri-plugin-window-state = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2" }
tauri-plugin-fs = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2" }
tokio = { version = "1.36.0", features = ["sync"] }
uuid = "1.3.0"
log = "0.4.20"
uuid = "1.7.0"
log = "0.4.21"
datetime = "0.5.2"
window-shadows = "0.2.2"
reqwest_cookie_store = "0.6.0"
grpc = { path = "./grpc" }
tokio-stream = "0.1.15"

2
src-tauri/grpc/Cargo.toml
View File

@@ -14,11 +14,9 @@ serde = { version = "1.0.196", features = ["derive"] }
serde_json = "1.0.113"
prost-reflect = { version = "0.12.0", features = ["serde", "derive"] }
log = "0.4.20"
once_cell = { version = "1.19.0", features = [] }
anyhow = "1.0.79"
hyper = { version = "0.14" }
hyper-rustls = { version = "0.24.0", features = ["http2"] }
protoc-bin-vendored = "3.0.0"
uuid = { version = "1.7.0", features = ["v4"] }
tauri = { version = "2.0.0-beta.16" }
tauri-plugin-shell = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v2" }

9
src-web/components/BinaryFileEditor.tsx
View File

@@ -30,15 +30,14 @@ export function BinaryFileEditor({
const handleClick = async () => {
await ignoreContentType.set(false);
const path = await open({
const selected = await open({
title: 'Select File',
multiple: false,
});
if (path) {
onChange({ filePath: path });
} else {
onChange({ filePath: undefined });
if (selected == null) {
return;
}
onChange({ filePath: selected.path });
};
const filePath = typeof body.filePath === 'string' ? body.filePath : undefined;

6
src-web/components/GrpcProtoSelection.tsx
View File

@@ -42,15 +42,15 @@ export function GrpcProtoSelection({ requestId }: Props) {
color="primary"
size="sm"
onClick={async () => {
const files = await open({
const selected = await open({
title: 'Select Proto Files',
multiple: true,
filters: [{ name: 'Proto Files', extensions: ['proto'] }],
});
if (files == null) {
if (selected == null) {
return;
}
const newFiles = files.map((f) => f.path).filter((p) => !protoFiles.includes(p));
const newFiles = selected.map((f) => f.path).filter((p) => !protoFiles.includes(p));
await protoFilesKv.set([...protoFiles, ...newFiles]);
await grpc.reflect.refetch();
}}

41
src-web/components/ImportCurlButton.tsx Normal file
View File

@@ -0,0 +1,41 @@
import React, { useState } from 'react';
import { Button } from './core/Button';
import { useClipboardText } from '../hooks/useClipboardText';
import { useImportCurl } from '../hooks/useImportCurl';
import { Icon } from './core/Icon';
import { motion } from 'framer-motion';
export function ImportCurlButton() {
const [clipboardText] = useClipboardText();
const [lastImportedCmd, setLastImportedCmd] = useState<string>('');
const importCurl = useImportCurl();
if (!clipboardText?.trim().startsWith('curl ') || lastImportedCmd === clipboardText) {
return null;
}
return (
<motion.div
initial={{ opacity: 0, scale: 0 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ delay: 0.5 }}
>
<Button
size="xs"
variant="border"
color="secondary"
leftSlot={<Icon icon="paste" size="sm" />}
onClick={() => {
importCurl.mutate({
requestId: null, // Create request
command: clipboardText,
});
// setClipboardText('');
setLastImportedCmd(clipboardText);
}}
>
Import Curl
</Button>
</motion.div>
);
}

39
src-web/components/RequestPane.tsx
View File

@@ -38,9 +38,7 @@ import { GraphQLEditor } from './GraphQLEditor';
import { HeadersEditor } from './HeadersEditor';
import { UrlBar } from './UrlBar';
import { UrlParametersEditor } from './UrlParameterEditor';
import { useCurlToRequest } from '../hooks/useCurlToRequest';
import { useToast } from './ToastContext';
import { Icon } from './core/Icon';
import { useImportCurl } from '../hooks/useImportCurl';
interface Props {
style: CSSProperties;
@@ -230,11 +228,9 @@ export const RequestPane = memo(function RequestPane({
[updateRequest],
);
const importCurl = useCurlToRequest();
const toast = useToast();
const isLoading = useIsResponseLoading(activeRequestId ?? null);
const { updateKey } = useRequestUpdateKey(activeRequestId ?? null);
const importCurl = useImportCurl();
return (
<div
@@ -244,6 +240,7 @@ export const RequestPane = memo(function RequestPane({
{activeRequest && (
<>
<UrlBar
key={forceUpdateKey}
url={activeRequest.url}
method={activeRequest.method}
placeholder="https://example.com"
@@ -252,14 +249,6 @@ export const RequestPane = memo(function RequestPane({
return;
}
importCurl.mutate({ requestId: activeRequestId, command });
toast.show({
render: () => [
<>
<Icon icon="info" />
<span>Curl command imported</span>
</>,
],
});
}}
onSend={handleSend}
onCancel={handleCancel}
@@ -326,17 +315,6 @@ export const RequestPane = memo(function RequestPane({
contentType="text/xml"
onChange={handleBodyTextChange}
/>
) : activeRequest.bodyType === BODY_TYPE_OTHER ? (
<Editor
forceUpdateKey={forceUpdateKey}
useTemplating
autocompleteVariables
placeholder="..."
className="!bg-gray-50"
heightMode={fullHeight ? 'full' : 'auto'}
defaultValue={`${activeRequest.body?.text ?? ''}`}
onChange={handleBodyTextChange}
/>
) : activeRequest.bodyType === BODY_TYPE_GRAPHQL ? (
<GraphQLEditor
forceUpdateKey={forceUpdateKey}
@@ -365,6 +343,17 @@ export const RequestPane = memo(function RequestPane({
onChange={handleBinaryFileChange}
onChangeContentType={handleContentTypeChange}
/>
) : typeof activeRequest.bodyType === 'string' ? (
<Editor
forceUpdateKey={forceUpdateKey}
useTemplating
autocompleteVariables
placeholder="..."
className="!bg-gray-50"
heightMode={fullHeight ? 'full' : 'auto'}
defaultValue={`${activeRequest.body?.text ?? ''}`}
onChange={handleBodyTextChange}
/>
) : (
<EmptyStateText>Empty Body</EmptyStateText>
)}

2
src-web/components/Sidebar.tsx
View File

@@ -608,7 +608,7 @@ const SidebarItem = forwardRef(function SidebarItem(
const deleteRequest = useDeleteRequest(activeRequest ?? null);
const duplicateHttpRequest = useDuplicateHttpRequest({ id: itemId, navigateAfter: true });
const duplicateGrpcRequest = useDuplicateGrpcRequest({ id: itemId, navigateAfter: true });
const [copyAsCurl] = useCopyAsCurl(itemId);
const [, copyAsCurl] = useCopyAsCurl(itemId);
const sendRequest = useSendRequest(itemId);
const sendManyRequests = useSendManyRequests();
const latestHttpResponse = useLatestHttpResponse(itemId);

8
src-web/components/ToastContext.tsx
View File

@@ -1,3 +1,4 @@
import type { ReactNode } from 'react';
import React, { createContext, useContext, useMemo, useRef, useState } from 'react';
import type { ToastProps } from './core/Toast';
import { Toast } from './core/Toast';
@@ -6,7 +7,7 @@ import { Portal } from './Portal';
import { AnimatePresence } from 'framer-motion';
type ToastEntry = {
render: ({ hide }: { hide: () => void }) => React.ReactNode;
message: ReactNode;
timeout?: number;
} & Omit<ToastProps, 'onClose' | 'open' | 'children' | 'timeout'>;
@@ -66,12 +67,11 @@ export const ToastProvider = ({ children }: { children: React.ReactNode }) => {
);
};
function ToastInstance({ id, render, timeout, ...props }: PrivateToastEntry) {
function ToastInstance({ id, message, timeout, ...props }: PrivateToastEntry) {
const { actions } = useContext(ToastContext);
const children = render({ hide: () => actions.hide(id) });
return (
<Toast open timeout={timeout} onClose={() => actions.hide(id)} {...props}>
{children}
{message}
</Toast>
);
}

29
src-web/components/UrlBar.tsx
View File

@@ -1,5 +1,5 @@
import type { EditorView } from 'codemirror';
import type { FormEvent } from 'react';
import type { FormEvent, ReactNode } from 'react';
import { memo, useRef, useState } from 'react';
import { useHotKey } from '../hooks/useHotKey';
import type { HttpRequest } from '../lib/models';
@@ -20,6 +20,7 @@ type Props = Pick<HttpRequest, 'url'> & {
onMethodChange?: (method: string) => void;
isLoading: boolean;
forceUpdateKey: string;
rightSlot?: ReactNode;
};
export const UrlBar = memo(function UrlBar({
@@ -34,6 +35,7 @@ export const UrlBar = memo(function UrlBar({
onMethodChange,
onPaste,
submitIcon = 'sendHorizontal',
rightSlot,
isLoading,
}: Props) {
const inputRef = useRef<EditorView>(null);
@@ -84,17 +86,20 @@ export const UrlBar = memo(function UrlBar({
)
}
rightSlot={
submitIcon !== null && (
<IconButton
size="xs"
iconSize="md"
title="Send Request"
type="submit"
className="w-8 my-0.5 mr-0.5"
icon={isLoading ? 'x' : submitIcon}
hotkeyAction="http_request.send"
/>
)
<>
{rightSlot}
{submitIcon !== null && (
<IconButton
size="xs"
iconSize="md"
title="Send Request"
type="submit"
className="w-8 my-0.5 mr-0.5"
icon={isLoading ? 'x' : submitIcon}
hotkeyAction="http_request.send"
/>
)}
</>
}
/>
</form>

22
src-web/components/Workspace.tsx
View File

@@ -6,7 +6,7 @@ import type {
MouseEvent as ReactMouseEvent,
ReactNode,
} from 'react';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { useCallback, useMemo, useRef, useState } from 'react';
import { useWindowSize } from 'react-use';
import { useActiveRequest } from '../hooks/useActiveRequest';
import { useActiveWorkspace } from '../hooks/useActiveWorkspace';
@@ -33,8 +33,6 @@ import { ResizeHandle } from './ResizeHandle';
import { Sidebar } from './Sidebar';
import { SidebarActions } from './SidebarActions';
import { WorkspaceHeader } from './WorkspaceHeader';
import { useClipboardText } from '../hooks/useClipboardText';
import { useToast } from './ToastContext';
const side = { gridArea: 'side' };
const head = { gridArea: 'head' };
@@ -56,24 +54,6 @@ export default function Workspace() {
const moveState = useRef<{ move: (e: MouseEvent) => void; up: (e: MouseEvent) => void } | null>(
null,
);
const clipboardText = useClipboardText();
const toast = useToast();
useEffect(() => {
const isCurlInClipboard = clipboardText?.startsWith('curl ');
if (!isCurlInClipboard) {
return;
}
toast.show({
render: () => (
<div>
<p>Curl command detected?</p>
<Button color="primary">Import</Button>
</div>
),
});
}, [clipboardText, toast]);
const unsub = () => {
if (moveState.current !== null) {

3
src-web/components/WorkspaceHeader.tsx
View File

@@ -11,6 +11,7 @@ import { RecentRequestsDropdown } from './RecentRequestsDropdown';
import { SettingsDropdown } from './SettingsDropdown';
import { SidebarActions } from './SidebarActions';
import { WorkspaceActionsDropdown } from './WorkspaceActionsDropdown';
import { ImportCurlButton } from './ImportCurlButton';
interface Props {
className?: string;
@@ -19,6 +20,7 @@ interface Props {
export const WorkspaceHeader = memo(function WorkspaceHeader({ className }: Props) {
const osInfo = useOsInfo();
const [maximized, setMaximized] = useState<boolean>(false);
return (
<HStack
space={2}
@@ -39,6 +41,7 @@ export const WorkspaceHeader = memo(function WorkspaceHeader({ className }: Prop
<RecentRequestsDropdown />
</div>
<div className="flex-1 flex items-center h-full justify-end pointer-events-none">
<ImportCurlButton />
<SettingsDropdown />
{(osInfo?.osType === 'linux' || osInfo?.osType === 'windows') && (
<HStack className="ml-4" alignItems="center">

2
src-web/components/core/Button.tsx
View File

@@ -10,7 +10,7 @@ export type ButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'color'> & {
color?: 'custom' | 'default' | 'gray' | 'primary' | 'secondary' | 'warning' | 'danger';
variant?: 'border' | 'solid';
isLoading?: boolean;
size?: 'sm' | 'md' | 'xs';
size?: 'xs' | 'sm' | 'md';
justify?: 'start' | 'center';
type?: 'button' | 'submit';
forDropdown?: boolean;

7
src-web/components/core/Dropdown.tsx
View File

@@ -312,8 +312,8 @@ const Menu = forwardRef<Omit<DropdownRef, 'open' | 'isOpen' | 'toggle'>, MenuPro
handleClose();
}
setSelectedIndex(null);
if (i.type !== 'separator') {
i.onSelect?.();
if (i.type !== 'separator' && typeof i.onSelect === 'function') {
i.onSelect();
}
},
[handleClose],
@@ -506,7 +506,7 @@ function MenuItem({ className, focused, onFocus, item, onSelect, ...props }: Men
return (
<Button
ref={initRef}
size="xs"
size="sm"
tabIndex={-1}
onMouseEnter={(e) => e.currentTarget.focus()}
onMouseLeave={(e) => e.currentTarget.blur()}
@@ -518,6 +518,7 @@ function MenuItem({ className, focused, onFocus, item, onSelect, ...props }: Men
rightSlot={rightSlot && <div className="ml-auto pl-3">{rightSlot}</div>}
className={classNames(
className,
'h-xs', // More compact
'min-w-[8rem] outline-none px-2 mx-1.5 flex text-sm text-gray-700 whitespace-nowrap',
'focus:bg-highlight focus:text-gray-800 rounded',
item.variant === 'danger' && 'text-red-600',

2
src-web/components/core/Icon.tsx
View File

@@ -19,6 +19,7 @@ const icons = {
cake: lucide.CakeIcon,
chat: lucide.MessageSquare,
check: lucide.CheckIcon,
checkCircle: lucide.CheckCircleIcon,
chevronDown: lucide.ChevronDownIcon,
chevronRight: lucide.ChevronRightIcon,
code: lucide.CodeIcon,
@@ -41,6 +42,7 @@ const icons = {
magicWand: lucide.Wand2Icon,
minus: lucide.MinusIcon,
moreVertical: lucide.MoreVerticalIcon,
paste: lucide.ClipboardPasteIcon,
pencil: lucide.PencilIcon,
plug: lucide.Plug,
plus: lucide.PlusIcon,

13
src-web/components/core/PairEditor.tsx
View File

@@ -392,11 +392,15 @@ function PairEditorRow({
className="font-mono text-xs"
onClick={async (e) => {
e.preventDefault();
const file = await open({
const selected = await open({
title: 'Select file',
multiple: false,
});
handleChangeValueFile((Array.isArray(file) ? file[0] : file) ?? '');
if (selected == null) {
return;
}
handleChangeValueFile(selected.path);
}}
>
{getFileName(pairContainer.pair.value) || 'Select File'}
@@ -491,7 +495,8 @@ const newPairContainer = (initialPair?: Pair): PairContainer => {
return { id, pair };
};
const getFileName = (path: string): string => {
const parts = path.split(/[\\/]/);
const getFileName = (path: string | null | undefined): string => {
console.log('PATH', path);
const parts = String(path).split(/[\\/]/);
return parts[parts.length - 1] ?? '';
};

41
src-web/components/core/Toast.tsx
View File

@@ -1,23 +1,37 @@
import classNames from 'classnames';
import { motion } from 'framer-motion';
import type { ReactNode } from 'react';
import React, { useMemo } from 'react';
import React from 'react';
import { useKey } from 'react-use';
import { Heading } from './Heading';
import { IconButton } from './IconButton';
import type { IconProps } from './Icon';
import { Icon } from './Icon';
export interface ToastProps {
children: ReactNode;
open: boolean;
onClose: () => void;
title?: ReactNode;
className?: string;
timeout: number;
variant?: 'copied' | 'success' | 'info' | 'warning' | 'error';
}
export function Toast({ children, className, open, onClose, title, timeout }: ToastProps) {
const titleId = useMemo(() => Math.random().toString(36).slice(2), []);
const ICONS: Record<NonNullable<ToastProps['variant']>, IconProps['icon']> = {
copied: 'copyCheck',
warning: 'alert',
error: 'alert',
info: 'info',
success: 'checkCircle',
};
export function Toast({
children,
className,
open,
onClose,
timeout,
variant = 'info',
}: ToastProps) {
useKey(
'Escape',
() => {
@@ -46,13 +60,16 @@ export function Toast({ children, className, open, onClose, title, timeout }: To
'text-gray-700',
)}
>
<div className="px-3 py-2">
{title && (
<Heading size={3} id={titleId}>
{title}
</Heading>
)}
<div className="px-3 py-2 flex items-center gap-2">
<Icon
icon={ICONS[variant]}
className={classNames(
variant === 'success' && 'text-green-500',
variant === 'warning' && 'text-orange-500',
variant === 'error' && 'text-red-500',
variant === 'copied' && 'text-violet-500',
)}
/>
<div className="flex items-center gap-2">{children}</div>
</div>

21
src-web/hooks/useClipboardText.ts
View File

@@ -1,9 +1,18 @@
import { useQuery } from '@tanstack/react-query';
import { readText } from '@tauri-apps/plugin-clipboard-manager';
import { readText, writeText } from '@tauri-apps/plugin-clipboard-manager';
import { useCallback, useEffect, useState } from 'react';
import { useWindowFocus } from './useWindowFocus';
export function useClipboardText() {
return useQuery({
queryKey: [],
queryFn: () => readText(),
}).data;
const [value, setValue] = useState<string>('');
const focused = useWindowFocus();
useEffect(() => {
readText().then(setValue);
}, [focused]);
const setText = useCallback((text: string) => {
writeText(text).catch(console.error);
}, []);
return [value, setText] as const;
}

11
src-web/hooks/useCopyAsCurl.tsx
View File

@@ -1,8 +1,7 @@
import { invoke } from '@tauri-apps/api/core';
import { writeText } from '@tauri-apps/plugin-clipboard-manager';
import React, { useState } from 'react';
import { useState } from 'react';
import { useToast } from '../components/ToastContext';
import { Icon } from '../components/core/Icon';
export function useCopyAsCurl(requestId: string) {
const [checked, setChecked] = useState<boolean>(false);
@@ -15,12 +14,8 @@ export function useCopyAsCurl(requestId: string) {
setChecked(true);
setTimeout(() => setChecked(false), 800);
toast.show({
render: () => [
<>
<Icon icon="copyCheck" />
<span>Command copied to clipboard</span>
</>,
],
variant: 'copied',
message: 'Curl copied to clipboard',
});
return cmd;
},

22
src-web/hooks/useCurlToRequest.ts → src-web/hooks/useImportCurl.ts
View File

@@ -3,22 +3,34 @@ import { useMutation } from '@tanstack/react-query';
import { useActiveWorkspaceId } from './useActiveWorkspaceId';
import { useRequestUpdateKey } from './useRequestUpdateKey';
import { useUpdateAnyHttpRequest } from './useUpdateAnyHttpRequest';
import { useToast } from '../components/ToastContext';
import { useCreateHttpRequest } from './useCreateHttpRequest';
export function useCurlToRequest() {
export function useImportCurl() {
const workspaceId = useActiveWorkspaceId();
const updateRequest = useUpdateAnyHttpRequest();
const createRequest = useCreateHttpRequest();
const { wasUpdatedExternally } = useRequestUpdateKey(null);
const toast = useToast();
return useMutation({
mutationFn: async ({ requestId, command }: { requestId: string; command: string }) => {
mutationFn: async ({ requestId, command }: { requestId: string | null; command: string }) => {
const request: Record<string, unknown> = await invoke('cmd_curl_to_request', {
command,
workspaceId,
});
delete request.id;
await updateRequest.mutateAsync({ id: requestId, update: request });
wasUpdatedExternally(requestId);
console.log('FOO', request);
const id = requestId ?? (await createRequest.mutateAsync({})).id;
await updateRequest.mutateAsync({ id, update: request });
const verb = requestId ? 'updated' : 'created';
toast.show({
variant: 'success',
message: `Request ${verb} from Curl`,
});
wasUpdatedExternally(id);
},
});
}