Skip to content

Commit e35ec27

Browse files
Angular2GuyAngular2Guy
committed
feat: http client
1 parent 9007131 commit e35ec27

File tree

8 files changed

+101
-104
lines changed

8 files changed

+101
-104
lines changed

‎frontend/package-lock.json‎

Lines changed: 8 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@
2020
"ol": "^7.3.0",
2121
"react": "^18.2.0",
2222
"react-dom": "^18.2.0",
23-
"react-scripts": "5.0.1",
2423
"react-router": "^7.8.1",
24+
"react-scripts": "5.0.1",
2525
"recharts": "^2.12.4",
2626
"recoil": "^0.7.6",
2727
"sass": "^1.58.0",

‎frontend/src/components/LocationModal.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {UserDataState} from "../GlobalState";
1616
import { useMemo,useEffect,useState,FormEvent,ChangeEvent,SyntheticEvent } from "react";
1717
import {Box,TextField,Button,Dialog,DialogContent, Autocomplete} from '@mui/material';
1818
import styles from './modal.module.scss';
19-
import { PostCodeLocation, UserRequest, UserResponse } from "../service/dtos";
19+
import { PostCodeLocation, UserRequest } from "../service/dtos";
2020
import { fetchLocation, postLocationRadius } from "../service/http-client";
2121

2222
const LocationModal = () => {
@@ -32,7 +32,6 @@ const LocationModal = () => {
3232
const [globalUserDataState, setGlobalUserDataState] = useRecoilState(GlobalState.userDataState);
3333
const globalUserNameState = useRecoilValue(GlobalState.userNameState);
3434

35-
3635
useEffect(() => {
3736
if (!open) {
3837
setOptions([]);

‎frontend/src/components/LoginModal.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import { UserDataState } from "../GlobalState";
1717
import { useState, ChangeEventHandler, FormEvent, BaseSyntheticEvent } from "react";
1818
import { Box, TextField, Button, Tab, Tabs, Dialog, DialogContent } from '@mui/material';
1919
import { useNavigate } from "react-router";
20-
import { UserRequest, UserResponse } from "../service/dtos";
20+
import { UserResponse } from "../service/dtos";
2121
import { postLogin, postSignin } from "../service/http-client";
2222

2323
interface MsgData {

‎frontend/src/components/Main.tsx‎

Lines changed: 4 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,11 @@ import { useEffect, useState, SyntheticEvent } from 'react';
1515
import DataTable, { TableDataRow } from './DataTable';
1616
import GsMap from './GsMap';
1717
import { useRecoilRefresher_UNSTABLE, useRecoilValue } from 'recoil';
18-
import GlobalState, { UserDataState } from '../GlobalState';
18+
import GlobalState from '../GlobalState';
1919
//import styles from './main.module.scss';
2020
import Chart from './Chart';
2121
import { useNavigate } from 'react-router';
22-
import { GasPriceAvgs, GasStation, Notification, MyDataJson, TimeSlotResponse, GsValue, TimeSlot } from '../service/dtos';
22+
import { MyDataJson, GsValue, TimeSlot } from '../service/dtos';
2323
import { fetchGasStations, fetchPriceAvgs, fetchTimeSlots, fetchUserNotifications } from '../service/http-client';
2424

2525

@@ -91,10 +91,7 @@ export default function Main() {
9191
}
9292

9393
const fetchLastMatches = async (jwtToken: string) => {
94-
const result = await fetchUserNotifications(jwtToken, controller, globalUserUuidState);
95-
const myResult = result.map(value => {
96-
return JSON.parse(value?.DataJson);
97-
});
94+
const myResult = await fetchUserNotifications(jwtToken, controller, globalUserUuidState);
9895
//console.log(myJson);
9996
const result2 = myResult?.map(value => {
10097
//console.log(JSON.parse(value?.DataJson));
@@ -107,12 +104,7 @@ export default function Main() {
107104
});
108105
})?.flat() || [];
109106
setRows(result2);
110-
//const result
111-
const requestOptions2 = {
112-
method: 'GET',
113-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
114-
signal: controller?.signal
115-
}
107+
//const result
116108
const myPostcode = formatPostCode(globalUserDataState.PostCode);
117109
const myJson1 = await fetchTimeSlots(jwtToken, controller, myPostcode);
118110
const timeSlots = [] as TimeSlot[];

‎frontend/src/components/TargetPriceModal.tsx‎

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@ import { useRecoilState, useRecoilValue } from "recoil";
1414
import GlobalState from "../GlobalState";
1515
import { Box, TextField, Button, Dialog, DialogContent } from '@mui/material';
1616
import { useState, useMemo, ChangeEventHandler, FormEvent } from "react";
17-
import { UserRequest, UserResponse } from "../service/dtos";
17+
import { UserRequest } from "../service/dtos";
18+
import { postTargetPrices } from "../service/http-client";
1819

1920

2021
const TargetPriceModal = () => {
@@ -59,20 +60,15 @@ const TargetPriceModal = () => {
5960

6061
const handleSubmit = async (event: FormEvent) => {
6162
event.preventDefault();
62-
if(!!controller) {
63+
if (!!controller) {
6364
controller.abort();
6465
}
6566
const myDiesel = updatePrice(targetDiesel);
6667
const myE5 = updatePrice(targetE5);
6768
const myE10 = updatePrice(targetE10);
68-
const requestOptions = {
69-
method: 'POST',
70-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${globalJwtTokenState}` },
71-
body: JSON.stringify({ Username: globalUserNameState, Password: '', TargetDiesel: myDiesel, TargetE10: myE10, TargetE5: myE5 } as UserRequest)
72-
};
7369
controller = new AbortController();
74-
const response = await fetch('/appuser/targetprices', requestOptions);
75-
const result = await response.json() as UserResponse;
70+
const requestString = JSON.stringify({ Username: globalUserNameState, Password: '', TargetDiesel: myDiesel, TargetE10: myE10, TargetE5: myE5 } as UserRequest);
71+
const result = await postTargetPrices(globalJwtTokenState, controller, requestString);
7672
controller = null;
7773
setGlobalUserDataState({
7874
Latitude: globalUserDataState.Latitude, Longitude: globalUserDataState.Longitude, SearchRadius: globalUserDataState.SearchRadius, PostCode: globalUserDataState.PostCode,

‎frontend/src/service/dtos.ts‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -84,10 +84,6 @@ export interface TimeSlot {
8484
diesel: number;
8585
}
8686

87-
export interface ChartProps {
88-
timeSlots: TimeSlot[];
89-
}
90-
9187
export interface GsValue {
9288
location: string;
9389
e5: number;

‎frontend/src/service/http-client.ts‎

Lines changed: 81 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,103 @@
11
import { UserDataState } from "../GlobalState";
22
import { GasPriceAvgs, GasStation, Notification, PostCodeLocation, TimeSlotResponse, UserRequest, UserResponse } from "./dtos";
33

4-
const fetchGasStations = async function(jwtToken: string, controller: AbortController | null, globalUserDataState: UserDataState): Promise<GasStation[]> {
4+
const fetchGasStations = async function (jwtToken: string, controller: AbortController | null, globalUserDataState: UserDataState): Promise<GasStation[]> {
55
const requestOptions2 = {
6-
method: 'POST',
7-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
8-
body: JSON.stringify({ Longitude: globalUserDataState.Longitude, Latitude: globalUserDataState.Latitude, Radius: globalUserDataState.SearchRadius }),
9-
signal: controller?.signal
10-
}
11-
const result = await fetch('/gasstation/search/location', requestOptions2);
12-
const myResult = result.json() as Promise<GasStation[]>;
13-
return myResult;
6+
method: 'POST',
7+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
8+
body: JSON.stringify({ Longitude: globalUserDataState.Longitude, Latitude: globalUserDataState.Latitude, Radius: globalUserDataState.SearchRadius }),
9+
signal: controller?.signal
10+
}
11+
const result = await fetch('/gasstation/search/location', requestOptions2);
12+
const myResult = result.json() as Promise<GasStation[]>;
13+
return myResult;
1414
};
1515

16-
const fetchPriceAvgs = async function(jwtToken: string, controller: AbortController | null, myPostcode: string): Promise<GasPriceAvgs> {
17-
const requestOptions3 = {
18-
method: 'GET',
19-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
20-
signal: controller?.signal
21-
}
22-
const result = await fetch(`/gasprice/avgs/${myPostcode}`, requestOptions3);
23-
return result.json() as Promise<GasPriceAvgs>;
16+
const fetchPriceAvgs = async function (jwtToken: string, controller: AbortController | null, myPostcode: string): Promise<GasPriceAvgs> {
17+
const requestOptions3 = {
18+
method: 'GET',
19+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
20+
signal: controller?.signal
21+
}
22+
const result = await fetch(`/gasprice/avgs/${myPostcode}`, requestOptions3);
23+
return result.json() as Promise<GasPriceAvgs>;
2424
}
2525

26-
const fetchUserNotifications = async function(jwtToken: string, controller: AbortController | null, globalUserUuidState: string): Promise<Notification[]> {
27-
const requestOptions1 = {
28-
method: 'GET',
29-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
30-
signal: controller?.signal
31-
}
32-
const result = await fetch(`/usernotification/current/${globalUserUuidState}`, requestOptions1);
33-
return result.json() as Promise<Notification[]>;
26+
const fetchUserNotifications = async function (jwtToken: string, controller: AbortController | null, globalUserUuidState: string): Promise<Notification[]> {
27+
const requestOptions1 = {
28+
method: 'GET',
29+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
30+
signal: controller?.signal
31+
}
32+
const result = await fetch(`/usernotification/current/${globalUserUuidState}`, requestOptions1);
33+
return result.json() as Promise<Notification[]>;
3434
}
3535

36-
const fetchTimeSlots = async function(jwtToken: string, controller: AbortController | null, myPostcode: string): Promise<TimeSlotResponse[]> {
37-
const requestOptions2 = {
38-
method: 'GET',
39-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
40-
signal: controller?.signal
41-
}
42-
const result = await fetch(`/postcode/countytimeslots/${myPostcode}`, requestOptions2);
43-
const myResult = result.json() as Promise<TimeSlotResponse[]>;
44-
return myResult;
45-
}
36+
const fetchTimeSlots = async function (jwtToken: string, controller: AbortController | null, myPostcode: string): Promise<TimeSlotResponse[]> {
37+
const requestOptions2 = {
38+
method: 'GET',
39+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
40+
signal: controller?.signal
41+
}
42+
const result = await fetch(`/postcode/countytimeslots/${myPostcode}`, requestOptions2);
43+
const myResult = result.json() as Promise<TimeSlotResponse[]>;
44+
return myResult;
45+
}
4646

47-
const postLogin = async function(userName: string, password1: string, controller: AbortController | null): Promise<UserResponse> {
48-
const requestOptions = loginSigninOptions(userName, password1, controller);
49-
const result = await fetch('/appuser/login', requestOptions);
50-
return result.json() as Promise<UserResponse>;
47+
const postLogin = async function (userName: string, password1: string, controller: AbortController | null): Promise<UserResponse> {
48+
const requestOptions = loginSigninOptions(userName, password1, controller);
49+
const result = await fetch('/appuser/login', requestOptions);
50+
return result.json() as Promise<UserResponse>;
5151
}
5252

53-
const postSignin = async function(userName: string, password1: string, controller: AbortController | null): Promise<UserResponse> {
54-
const requestOptions = loginSigninOptions(userName, password1, controller);
55-
const result = await fetch('/appuser/signin', requestOptions);
56-
return result.json() as Promise<UserResponse>;
53+
const postSignin = async function (userName: string, password1: string, controller: AbortController | null): Promise<UserResponse> {
54+
const requestOptions = loginSigninOptions(userName, password1, controller);
55+
const result = await fetch('/appuser/signin', requestOptions);
56+
return result.json() as Promise<UserResponse>;
5757
}
5858

5959
const loginSigninOptions = (userName: string, password1: string, controller: AbortController | null) => {
60-
return {
61-
method: 'POST',
62-
headers: { 'Content-Type': 'application/json' },
63-
body: JSON.stringify({ Username: userName, Password: password1 } as UserRequest),
64-
signal: controller?.signal
65-
};
60+
return {
61+
method: 'POST',
62+
headers: { 'Content-Type': 'application/json' },
63+
body: JSON.stringify({ Username: userName, Password: password1 } as UserRequest),
64+
signal: controller?.signal
65+
};
6666
};
6767

68-
const postLocationRadius = async function(jwtToken: string, controller: AbortController | null, requestString: string): Promise<UserResponse> {
69-
const requestOptions = {
70-
method: 'POST',
71-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}`},
72-
body: requestString,
73-
signal: controller?.signal
74-
};
75-
const response = await fetch('/appuser/locationradius', requestOptions);
76-
const userResponse = response.json() as UserResponse;
77-
return userResponse;
68+
const postLocationRadius = async function (jwtToken: string, controller: AbortController | null, requestString: string): Promise<UserResponse> {
69+
const requestOptions = {
70+
method: 'POST',
71+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
72+
body: requestString,
73+
signal: controller?.signal
74+
};
75+
const response = await fetch('/appuser/locationradius', requestOptions);
76+
const userResponse = response.json() as UserResponse;
77+
return userResponse;
78+
}
79+
80+
const fetchLocation = async function (jwtToken: string, controller: AbortController | null, location: string): Promise<PostCodeLocation[]> {
81+
const requestOptions = {
82+
method: 'GET',
83+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
84+
signal: controller?.signal
85+
};
86+
const response = await fetch(`/appuser/location?location=${location}`, requestOptions);
87+
const locations = response.json() as Promise<PostCodeLocation[]>;
88+
return locations;
7889
}
7990

80-
const fetchLocation = async function(jwtToken: string, controller: AbortController | null, location: string): Promise<PostCodeLocation[]> {
91+
const postTargetPrices = async function (jwtToken: string, controller: AbortController | null, requestString: string): Promise<UserResponse> {
8192
const requestOptions = {
82-
method: 'GET',
83-
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
84-
signal: controller?.signal
85-
};
86-
const response = await fetch(`/appuser/location?location=${location}`, requestOptions);
87-
const locations = response.json() as Promise<PostCodeLocation[]>;
88-
return locations;
93+
method: 'POST',
94+
headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${jwtToken}` },
95+
body: requestString,
96+
signal: controller?.signal
97+
};
98+
const response = await fetch('/appuser/targetprices', requestOptions);
99+
const result = response.json() as Promise<UserResponse>;
100+
return result;
89101
}
90102

91103
export { fetchGasStations };
@@ -95,4 +107,5 @@ export { fetchTimeSlots };
95107
export { postLogin };
96108
export { postSignin };
97109
export { postLocationRadius };
98-
export { fetchLocation };
110+
export { fetchLocation };
111+
export { postTargetPrices };

0 commit comments

Comments
 (0)