Skip to content

Commit c45133a

Browse files
committed
fix tab issues
1 parent 4c65394 commit c45133a

8 files changed

Lines changed: 117 additions & 65 deletions

File tree

app.go

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ func (a *App) startup(ctx context.Context) {
3535
a.ctx = ctx
3636
}
3737

38-
func MakeRequest(c *http.Client,
38+
func makeRequest(c *http.Client,
3939
r *http.Request) ([]byte, *http.Response, error) {
4040
resp, err := c.Do(r)
4141
if err != nil {
@@ -116,7 +116,7 @@ func (a *App) MakeRequest(
116116
r.Header.Add(key, value)
117117
}
118118

119-
res, httpResp, err := MakeRequest(a.client, r)
119+
res, httpResp, err := makeRequest(a.client, r)
120120
if err != nil {
121121
result.Error = err.Error()
122122
return result

export.go

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,14 @@ import (
99
"github.com/wailsapp/wails/v2/pkg/runtime"
1010
)
1111

12-
func (a *App) Export(r RequestResult) error {
12+
type ExportFormat struct {
13+
Request Request
14+
RequestHeaders [][]Header
15+
RequestBodies []string
16+
Result RequestResult
17+
}
18+
19+
func (a *App) Export(req Request, reqHeaders [][]Header, reqBodies []string, r RequestResult) error {
1320
filepath, err := runtime.SaveFileDialog(a.ctx, runtime.SaveDialogOptions{
1421
DefaultFilename: "untitled-01.json",
1522
Title: "Export",
@@ -19,7 +26,14 @@ func (a *App) Export(r RequestResult) error {
1926
return err
2027
}
2128

22-
js, err := json.MarshalIndent(&r, "", " ")
29+
out := ExportFormat{
30+
Request: req,
31+
RequestHeaders: reqHeaders,
32+
RequestBodies: reqBodies,
33+
Result: r,
34+
}
35+
36+
js, err := json.MarshalIndent(&out, "", " ")
2337
if err != nil {
2438
log.Println(err)
2539
return err

frontend/src/App.tsx

Lines changed: 60 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -24,24 +24,23 @@ import {Header} from './lib/header';
2424
import {RequestHeader} from './components/headerform';
2525

2626
class Request {
27-
Method: string;
28-
URL: string;
29-
Headers: Header;
30-
Body: string;
27+
method: string;
28+
url: string;
29+
headers: {[key: string]: string};
30+
body: string;
3131

3232
constructor(source: any = {}) {
3333
if ('string' === typeof source) source = JSON.parse(source);
34-
this.Method = source["Method"];
35-
this.URL = source["URL"];
36-
this.Headers = source["Headers"];
37-
this.Body = source["Body"];
34+
this.method = source["Method"];
35+
this.url = source["url"];
36+
this.headers = source["headers"];
37+
this.body = source["body"];
3838
}
3939
}
4040

4141

4242
function App() {
43-
const [value, setValue] = useState('one');
44-
const [reqBodies, setReqBodies] = useState([""])
43+
const [reqBodies, setReqBodies] = useState<Array<string>>([""])
4544
const [reqHeaders, setReqHeaders] = useState<Array<Array<Header>>>([[
4645
{Key: "", Value: ""},
4746
{Key: "", Value: ""},
@@ -52,7 +51,9 @@ function App() {
5251
{Key: "", Value: ""},
5352
]]);
5453

55-
const [responses, setResponses] = useState([new main.RequestResult])
54+
console.log(reqHeaders)
55+
56+
const [responses, setResponses] = useState<Array<main.RequestResult>>([new main.RequestResult])
5657
const [activeReqBody, setActiveReqBody] = useState(0)
5758
const [activeReqHeader, setActiveReqHeader] = useState(0)
5859
const [request, setRequest] = useState(new Request({"Method": "GET"}))
@@ -76,18 +77,17 @@ function App() {
7677
}));
7778
};
7879

79-
const updateActiveReqTab = (e: any) => {
80-
setActiveReqBody(e.target.value)
81-
setActiveReqHeader(e.target.value)
80+
const updateActiveReqTab = (e: any, index: number) => {
81+
setActiveReqBody(index)
82+
setActiveReqHeader(index)
8283
}
8384

8485
const addReqBody = (e: any) => {
85-
reqBodies.push(reqBodies[activeReqBody])
86-
reqHeaders.push(reqHeaders[activeReqBody])
87-
responses.push(responses[activeReqBody])
88-
setReqBodies([...reqBodies])
89-
setResponses([...responses])
90-
setReqHeaders([...reqHeaders])
86+
setReqBodies([...reqBodies].concat(...[reqBodies[activeReqBody]]))
87+
setReqHeaders(reqHeaders.concat([[{Key: "", Value: ""}]]))
88+
setResponses([...responses].concat(...[responses[activeReqBody]]))
89+
setActiveReqBody(activeReqBody+1)
90+
console.log(reqHeaders)
9191
}
9292

9393
const updateReqBody = (e: any) => {
@@ -108,16 +108,14 @@ function App() {
108108
};
109109

110110
const updateCurlBody = (e: any) => setCurlBody(e.target.value)
111-
const headers: Map<string, string> = new Map<string, string>
112-
113-
for (let k of reqHeaders[activeReqBody]) {
114-
headers.set(k.Key, k.Value)
115-
}
116-
117-
console.log(headers)
118111

119112
function makeRequest() {
120-
MakeRequest(request.URL, request.Method,
113+
const headers: Map<string, string> = new Map<string, string>
114+
115+
for (let k of reqHeaders[activeReqBody]) {
116+
headers.set(k.Key, k.Value)
117+
}
118+
MakeRequest(request.url, request.method,
121119
reqBodies[activeReqBody],
122120
headers).then((r: main.RequestResult) => {
123121
setResult(r)
@@ -128,10 +126,10 @@ function App() {
128126
function importCurl() {
129127
RunCurl(curlBody).then((result: any) => {
130128
let req = new Request({
131-
"Method": result.Method,
132-
"URL": result.URL,
133-
"Body": result.RequestBody,
134-
"Headers": result.ReqHeaders,
129+
"method": result.Method,
130+
"url": result.URL,
131+
"body": result.RequestBody,
132+
"headers": result.ReqHeaders,
135133
})
136134
setRequest(req)
137135
setResult(result)
@@ -140,7 +138,7 @@ function App() {
140138
}
141139

142140
function handleExport() {
143-
Export(result)
141+
Export(request, reqHeaders, reqBodies, result)
144142
}
145143

146144
const darkTheme = createTheme({
@@ -193,8 +191,8 @@ function App() {
193191
<Grid xs={2} sm={2} md={2} lg={1} sx={{marginTop: "1em"}}>
194192
<FormControl fullWidth variant='filled'>
195193
<InputLabel>Method</InputLabel>
196-
<Select label="Method" value={request.Method}
197-
color="success" name="Method" variant="filled"
194+
<Select label="Method" value={request.method}
195+
color="success" name="method" variant="filled"
198196
onChange={handleRequestChange}>
199197
<MenuItem value={"GET"}>GET</MenuItem>
200198
<MenuItem value={"POST"}>POST</MenuItem>
@@ -204,8 +202,8 @@ function App() {
204202
</Grid>
205203
<Grid xs={12} sm={12} md={8} lg={9}>
206204
<FormControl fullWidth>
207-
<TextField id="url" variant="standard" value={request.URL} fullWidth
208-
onChange={handleRequestChange} autoComplete="off" name="URL" />
205+
<TextField id="url" variant="standard" value={request.url} fullWidth
206+
onChange={handleRequestChange} autoComplete="off" name="url" />
209207
</FormControl>
210208
</Grid>
211209
<Grid xs={1} sm={1} md={1} lg={1}>
@@ -231,25 +229,40 @@ function App() {
231229
reqHeaders.map((d, index) =>
232230
<Button
233231
key={index}
234-
variant="contained" value={index} color="success" onClick={updateActiveReqTab}
232+
variant={activeReqBody===index ? "contained": "outlined"} value={index} color="success" onClick={(e) => updateActiveReqTab(e, index)}
235233
>{index + 1}</Button>)
236234
}
237235
<Button color="success" sx={{minWidth: "2rem", padding: "0em"}} onClick={addReqBody}>
238236
<AddIcon />
239237
</Button>
240238
</ButtonGroup>
241-
<RequestHeader activeReqHeader={activeReqHeader} reqHeaders={reqHeaders}></RequestHeader>
239+
{
240+
reqHeaders.map((p: Header[], baseIndex: number)=> p.map(
241+
(d: Header, index: number) => {
242+
return baseIndex === activeReqHeader && <RequestHeader key={index.toString() + baseIndex.toString()}
243+
update={(h: Header) => {
244+
reqHeaders[activeReqHeader][index] = h;
245+
setReqHeaders([...reqHeaders]);
246+
console.log(reqHeaders);
247+
}
248+
}
249+
header={reqHeaders[activeReqHeader][index]}></RequestHeader>
250+
}
251+
))
252+
}
242253
</Grid>
243254
<Grid xs={7}>
244255
<ButtonGroup>
245256
<Button color="success">Request Body</Button>
246257
{
247258
reqBodies.map((d, index) => <Button
248259
key={index} style={{padding: "0em", minWidth: "2rem"}}
249-
variant="contained" value={index} color="success" onClick={updateActiveReqTab}
260+
value={index} color="success" onClick={(e) => updateActiveReqTab(e, index)}
261+
variant={activeReqBody===index ? "contained": "outlined"}
250262
>{index + 1}</Button>)
251263
}
252-
<Button color="success" sx={{minWidth: "2rem", padding: "0em"}} onClick={addReqBody}><AddIcon /></Button>
264+
<Button color="success" sx={{minWidth: "2rem", padding: "0em"}}
265+
onClick={addReqBody}><AddIcon /></Button>
253266
</ButtonGroup>
254267
<TextField margin='dense' rows={16} sx={{width: "100%", height: "100%"}}
255268
multiline variant="outlined" color="primary"
@@ -264,9 +277,11 @@ function App() {
264277
<ButtonGroup>
265278
<Button color="success">Response Headers</Button>
266279
{
267-
responses.map((d, index) => <Button
280+
responses.map((d, index) =>
281+
<Button
268282
key={index} style={{padding: "0em", minWidth: "2rem"}}
269-
variant="contained" value={index} color="success" onClick={updateActiveReqTab}
283+
variant={activeReqBody===index ? "contained": "outlined"}
284+
value={index} color="success" onClick={(e) => updateActiveReqTab(e, index)}
270285
>{index + 1}</Button>)
271286
}
272287
<Button color="success" onClick={addReqBody}><AddIcon /></Button>
@@ -280,7 +295,8 @@ function App() {
280295
{
281296
responses.map((d, index) => <Button
282297
key={index} style={{padding: "0em", minWidth: "2rem"}}
283-
variant="contained" value={index} color="success" onClick={updateActiveReqTab}
298+
variant={activeReqBody===index ? "contained": "outlined"}
299+
value={index} color="success" onClick={(e) => updateActiveReqTab(e, index)}
284300
>{index + 1}</Button>)
285301
}
286302
<Button color="success" onClick={addReqBody}><AddIcon /></Button>
Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,32 @@
11
import {TextField, Checkbox, FormControlLabel, Box} from "@mui/material";
2+
import {useState} from "react";
23
import {Header} from "../lib/header";
34

45
export interface HeaderProps {
5-
activeReqHeader: number
6-
reqHeaders: Header[][]
6+
header: Header
7+
update: (h: Header) => void
78
}
89

910
export const RequestHeader = (props: HeaderProps) => {
10-
11+
console.log(props.header)
1112
return (
12-
<>
13-
{
14-
props.reqHeaders[props.activeReqHeader].map((d: Header, index: number) =>
1513
<Box flex="flex" flexDirection="row">
1614
<Checkbox name="enabled" size="small"></Checkbox>
1715
<TextField margin="dense" size='small' style={{width: "30%"}}
18-
key={index} variant="filled" placeholder="Key" onChange={(e)=> d.Key=e.target.value}
19-
>{d.Key}</TextField>
16+
variant="filled" placeholder="Key" onBlur={(e)=> {
17+
props.header.Key=e.target.value
18+
props.update(props.header)
19+
}} value={props.header.Key}
20+
></TextField>
2021
<TextField margin='dense' style={{marginLeft: "4px", width: "60%"}}
21-
size='small' variant='filled' placeholder="Value" onChange={(e)=> d.Value=e.target.value}>
22-
{d.Value}</TextField>
23-
</Box>)
24-
}
25-
</>
22+
size='small' variant='filled' placeholder="Value" onBlur={(e)=> {
23+
props.header.Value=e.target.value
24+
props.update(props.header)
25+
}}
26+
value={props.header.Value}
27+
>
28+
</TextField>
29+
</Box>
2630
)
2731
}
2832

frontend/wailsjs/go/main/App.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
// This file is automatically generated. DO NOT EDIT
33
import {main} from '../models';
44

5-
export function Export(arg1:main.RequestResult):Promise<void>;
5+
export function Export(arg1:main.Request,arg2:Array<any>,arg3:Array<string>,arg4:main.RequestResult):Promise<void>;
66

77
export function MakeRequest(arg1:string,arg2:string,arg3:string,arg4:main.Headers):Promise<main.RequestResult>;
88

frontend/wailsjs/go/main/App.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
33
// This file is automatically generated. DO NOT EDIT
44

5-
export function Export(arg1) {
6-
return window['go']['main']['App']['Export'](arg1);
5+
export function Export(arg1, arg2, arg3, arg4) {
6+
return window['go']['main']['App']['Export'](arg1, arg2, arg3, arg4);
77
}
88

99
export function MakeRequest(arg1, arg2, arg3, arg4) {

frontend/wailsjs/go/models.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,23 @@
11
export namespace main {
22

3+
export class Request {
4+
method: string;
5+
url: string;
6+
headers: {[key: string]: string};
7+
body: string;
8+
9+
static createFrom(source: any = {}) {
10+
return new Request(source);
11+
}
12+
13+
constructor(source: any = {}) {
14+
if ('string' === typeof source) source = JSON.parse(source);
15+
this.method = source["method"];
16+
this.url = source["url"];
17+
this.headers = source["headers"];
18+
this.body = source["body"];
19+
}
20+
}
321
export class RequestResult {
422
Method: string;
523
URL: string;

parse_curl.go

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ func (h *Headers) ToString() string {
2323
type Request struct {
2424
Method string `json:"method"`
2525
Url string `json:"url"`
26-
Header Headers `json:"header"`
26+
Header Headers `json:"headers"`
2727
Body string `json:"body"`
2828
}
2929

0 commit comments

Comments
 (0)