Skip to content

Commit 8707c15

Browse files
authored
Merge pull request #1 from lupuszr/call-with-reducers
connect io to redux
2 parents 67eadaf + 4374523 commit 8707c15

18 files changed

+467
-170
lines changed

mock_server/db.json

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,168 @@
5050
"value": "20"
5151
},
5252
"id": 1
53+
},
54+
{
55+
"status": "in_progress",
56+
"interpreter": {
57+
"_isEmpty": false,
58+
"value": {
59+
"id": 1,
60+
"name": "George"
61+
}
62+
},
63+
"customer": {
64+
"_isEmpty": false,
65+
"value": {
66+
"id": "1",
67+
"given_name": "Alexis",
68+
"family_name": "Greek warior",
69+
"balance": {
70+
"amount": 10
71+
}
72+
}
73+
},
74+
"length": 0,
75+
"room_id": {
76+
"_isEmpty": false,
77+
"value": "20"
78+
},
79+
"id": 2
80+
},
81+
{
82+
"status": "in_progress",
83+
"interpreter": {
84+
"_isEmpty": false,
85+
"value": {
86+
"id": 1,
87+
"name": "George"
88+
}
89+
},
90+
"customer": {
91+
"_isEmpty": false,
92+
"value": {
93+
"id": "1",
94+
"given_name": "Alexis",
95+
"family_name": "Greek warior",
96+
"balance": {
97+
"amount": 10
98+
}
99+
}
100+
},
101+
"length": 0,
102+
"room_id": {
103+
"_isEmpty": false,
104+
"value": "20"
105+
},
106+
"id": 3
107+
},
108+
{
109+
"status": "in_progress",
110+
"interpreter": {
111+
"_isEmpty": false,
112+
"value": {
113+
"id": 1,
114+
"name": "George"
115+
}
116+
},
117+
"customer": {
118+
"_isEmpty": false,
119+
"value": {
120+
"id": "1",
121+
"given_name": "Alexis",
122+
"family_name": "Greek warior",
123+
"balance": {
124+
"amount": 10
125+
}
126+
}
127+
},
128+
"length": 0,
129+
"room_id": {
130+
"_isEmpty": false,
131+
"value": "20"
132+
},
133+
"id": 4
134+
},
135+
{
136+
"status": "in_progress",
137+
"interpreter": {
138+
"_isEmpty": false,
139+
"value": {
140+
"id": 1,
141+
"name": "George"
142+
}
143+
},
144+
"customer": {
145+
"_isEmpty": false,
146+
"value": {
147+
"id": "1",
148+
"given_name": "Alexis",
149+
"family_name": "Greek warior",
150+
"balance": {
151+
"amount": 10
152+
}
153+
}
154+
},
155+
"length": 0,
156+
"room_id": {
157+
"_isEmpty": false,
158+
"value": "20"
159+
},
160+
"id": 5
161+
},
162+
{
163+
"status": "in_progress",
164+
"interpreter": {
165+
"_isEmpty": false,
166+
"value": {
167+
"id": 1,
168+
"name": "George"
169+
}
170+
},
171+
"customer": {
172+
"_isEmpty": false,
173+
"value": {
174+
"id": "1",
175+
"given_name": "Alexis",
176+
"family_name": "Greek warior",
177+
"balance": {
178+
"amount": 10
179+
}
180+
}
181+
},
182+
"length": 0,
183+
"room_id": {
184+
"_isEmpty": false,
185+
"value": "20"
186+
},
187+
"id": 6
188+
},
189+
{
190+
"status": "in_progress",
191+
"interpreter": {
192+
"_isEmpty": false,
193+
"value": {
194+
"id": 1,
195+
"name": "George"
196+
}
197+
},
198+
"customer": {
199+
"_isEmpty": false,
200+
"value": {
201+
"id": "1",
202+
"given_name": "Alexis",
203+
"family_name": "Greek warior",
204+
"balance": {
205+
"amount": 10
206+
}
207+
}
208+
},
209+
"length": 0,
210+
"room_id": {
211+
"_isEmpty": false,
212+
"value": "20"
213+
},
214+
"id": 7
53215
}
54216
]
55217
}

package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,15 @@
88
"@types/node": "12.12.12",
99
"@types/react": "16.9.13",
1010
"@types/react-dom": "16.9.4",
11+
"@types/react-redux": "^7.1.5",
1112
"funfix": "^7.0.1",
1213
"json-server": "^0.15.1",
1314
"luxon": "^1.21.2",
1415
"react": "^16.12.0",
1516
"react-dom": "^16.12.0",
17+
"react-redux": "^7.1.3",
1618
"react-scripts": "3.2.0",
19+
"redux": "^4.0.4",
1720
"typescript": "3.7.2"
1821
},
1922
"scripts": {

src/App.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
11
import React from 'react';
2-
import logo from './logo.svg';
32
import './App.css';
4-
import Call from './features/Call';
3+
import Call from './features/call/Call';
4+
import { Provider } from 'react-redux';
5+
import store from './shared/store';
56

67
const App: React.FC = () => {
78
return (
8-
<div className="">
9-
<Call />
10-
</div>
9+
<Provider store={store}>
10+
<div className="">
11+
<Call />
12+
</div>
13+
</Provider>
1114
);
1215
}
1316

src/features/Call.tsx

Lines changed: 0 additions & 83 deletions
This file was deleted.

src/features/call/Call.tsx

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import { useDispatch, useSelector } from 'react-redux';
3+
import { actionT, startACall, cancelCall, endCall } from './actions';
4+
import { reduxStateT, ioReducerT } from '../../shared/reducers';
5+
import { Call } from './types';
6+
7+
const customerMock = {id: "1", given_name: "Alexis", family_name: "Greek warior", balance: { amount: 10 }};
8+
9+
const CallComponent = () => {
10+
const dispatch = useDispatch();
11+
const call = useSelector<reduxStateT, Call>(state => state.ioReducer.call);
12+
13+
const { status, customer, interpreter } = call;
14+
// console.log("callState is::", callState)
15+
return (
16+
<div>
17+
<button onClick={() => { dispatch(startACall(customerMock))}}>make a call</button>
18+
<button onClick={() => { dispatch(cancelCall())}}>cancell call</button>
19+
<button onClick={() => { dispatch(endCall())}}>stop call</button>
20+
<h4>
21+
Call status: {status}
22+
</h4>
23+
<h4>customer: {customer.fold(() => 'N/A', JSON.stringify)}</h4>
24+
<h4>interpreter: {interpreter.fold(() => 'N/A', JSON.stringify)}</h4>
25+
</div>
26+
)
27+
}
28+
29+
export default CallComponent;

src/implementations/CallAlgebraImplementation.ts renamed to src/features/call/CallAlgebraImplementation.ts

Lines changed: 4 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,11 @@
1-
import { Option, None, Cancelable, Future, Success, IO, Duration, TestScheduler, GlobalScheduler, ExecutionModel, Try, ICancelable, Some, Failure } from "funfix"
2-
3-
import CustomerCallAlgebra from '../algebras/CallAlgebra';
1+
import { Option, None, Future, IO, Duration, Try, Some, Failure } from "funfix"
2+
import { Balance, Customer, Interpreter, Call} from './types';
3+
import CustomerCallAlgebra from '../../algebras/CallAlgebra';
44

55

66
const fetchFuture = <T>(url: string, config: {}) => Future.fromPromise(fetch(url, config).then(res => res.json() as unknown as T));
77
const fetchIO = <T>(url: string, config: {}) => IO.fromFuture(fetchFuture<T>(url, config));
88

9-
export type Balance = {
10-
amount: number
11-
}
12-
13-
export type Customer = {
14-
id: string,
15-
given_name: string,
16-
family_name: string,
17-
balance: Balance
18-
}
19-
20-
export type Interpreter = {
21-
name: string
22-
}
23-
24-
export type Call = {
25-
status: 'cancelled' | 'in_progress' | 'not_started' | 'ended' | 'reconnecting',
26-
room_id: Option<string>,
27-
length: number,
28-
interpreter: Option<Interpreter>,
29-
customer: Option<Customer>
30-
}
31-
32-
const copyCall = (c: Call, match: Partial<{[a in keyof Call]: Call[a]}>): Call => {
33-
return {
34-
...c,
35-
...match
36-
}
37-
}
38-
399
const validateCustomer = (c: Customer): Option<Customer> => {
4010
return Some(c)
4111
}
@@ -48,7 +18,7 @@ export const callAlgebraImplementation = new CustomerCallAlgebra<Customer, Inter
4818
// background check
4919
(c: Customer) => fetchIO<Customer>(`http://localhost:3000/customer/${c.id}`, {}).chain(a => IO.of(() => a.balance.amount >= 0)),
5020
// ask for interpreter
51-
(c: Customer) => fetchIO<Interpreter>('http://localhost:3000/interpreter/1', {}),
21+
() => fetchIO<Interpreter>('http://localhost:3000/interpreter/1', {}),
5222
// updateCallInfo
5323
(call: Call) => IO.of(() => call),
5424
// establish call

0 commit comments

Comments
 (0)