@@ -177,36 +177,40 @@ import { match, P } from 'ts-pattern';
177177
178178const reducer = (state : State , event : Event ): State =>
179179 match <[State , Event ], State >([state , event ])
180- .with ([{ status: ' loading' }, { type: ' success' }], ([, event ]) => ({
181- status: ' success' ,
182- data: event .data ,
183- }))
184-
180+ .with (
181+ [{ status: ' loading' }, { type: ' success' }],
182+ ([, event ]) => ({
183+ status: ' success' ,
184+ data: event .data ,
185+ })
186+ )
185187 .with (
186188 [{ status: ' loading' }, { type: ' error' , error: P .select () }],
187189 (error ) => ({
188190 status: ' error' ,
189191 error ,
190192 })
191193 )
192-
193- .with ([{ status: P .not (' loading' ) }, { type: ' fetch' }], () => ({
194- status: ' loading' ,
195- startTime: Date .now (),
196- }))
197-
194+ .with (
195+ [{ status: P .not (' loading' ) }, { type: ' fetch' }],
196+ () => ({
197+ status: ' loading' ,
198+ startTime: Date .now (),
199+ })
200+ )
198201 .with (
199202 [
200- { status: ' loading' , startTime: P .when ((t ) => t + 2000 < Date .now ()) },
203+ {
204+ status: ' loading' ,
205+ startTime: P .when ((t ) => t + 2000 < Date .now ()),
206+ },
201207 { type: ' cancel' },
202208 ],
203209 () => ({
204210 status: ' idle' ,
205211 })
206212 )
207-
208213 .with (P ._ , () => state )
209-
210214 .exhaustive ();
211215```
212216
@@ -234,12 +238,15 @@ infer both of these types.
234238Then we add a first ` with ` clause:
235239
236240``` ts
237- .with ([{ status: ' loading' }, { type: ' success' }], ([state , event ]) => ({
238- // `state` is inferred as { status: 'loading' }
239- // `event` is inferred as { type: 'success', data: string }
240- status: ' success' ,
241- data: event .data ,
242- }))
241+ .with (
242+ [{ status: ' loading' }, { type: ' success' }],
243+ ([state , event ]) => ({
244+ // `state` is inferred as { status: 'loading' }
245+ // `event` is inferred as { type: 'success', data: string }
246+ status: ' success' ,
247+ data: event .data ,
248+ })
249+ )
243250```
244251
245252The first argument is the ** pattern** : the ** shape of value**
@@ -256,7 +263,10 @@ In the second `with` clause, we use the `P.select` function:
256263
257264``` ts
258265 .with (
259- [{ status: ' loading' }, { type: ' error' , error: P .select () }],
266+ [
267+ { status: ' loading' },
268+ { type: ' error' , error: P .select () }
269+ ],
260270 (error ) => ({
261271 status: ' error' ,
262272 error ,
@@ -270,7 +280,10 @@ Since we didn't pass any name to `P.select()`, It will inject the `event.error`
270280
271281``` ts
272282 .with (
273- [{ status: ' loading' }, { type: ' error' , error: P .select () }],
283+ [
284+ { status: ' loading' },
285+ { type: ' error' , error: P .select () }
286+ ],
274287 (error , stateAndEvent ) => {
275288 // error: Error
276289 // stateAndEvent: [{ status: 'loading' }, { type: 'error', error: Error }]
@@ -282,7 +295,10 @@ In a pattern, we can only have a **single** anonymous selection. If you need to
282295
283296``` ts
284297.with (
285- [{ status: ' success' , data: P .select (' prevData' ) }, { type: ' error' , error: P .select (' err' ) }],
298+ [
299+ { status: ' success' , data: P .select (' prevData' ) },
300+ { type: ' error' , error: P .select (' err' ) }
301+ ],
286302 ({ prevData , err }) => {
287303 // Do something with (prevData: string) and (err: Error).
288304 }
@@ -296,9 +312,12 @@ Each named selection will be injected inside a `selections` object, passed as fi
296312If you need to match on everything ** but** a specific value, you can use a ` P.not(<pattern>) ` pattern. it's a function taking a pattern and returning its opposite:
297313
298314``` ts
299- .with ([{ status: P .not (' loading' ) }, { type: ' fetch' }], () => ({
300- status: ' loading' ,
301- }))
315+ .with (
316+ [{ status: P .not (' loading' ) }, { type: ' fetch' }],
317+ () => ({
318+ status: ' loading' ,
319+ })
320+ )
302321```
303322
304323### ` P.when() ` and guard functions
0 commit comments