jk-gan / redux-flipper

Redux middleware for React Native for Flipper
MIT License
160 stars 21 forks source link

How to integrate with typescript #52

Open purnadi-winarno opened 3 years ago

purnadi-winarno commented 3 years ago

Hello, can you please add readme file how to integrate with typescript and redux toolkit? since I get this error message:

Argument of type 'AsyncThunkAction<User[], void, {}>' is not assignable to parameter of type 'AnyAction'.

Thank you

plwai commented 3 years ago

@purnadi-winarno

can you please provide more information? For example, the code segment which having type error.

purnadi-winarno commented 3 years ago

[image: image.png]

that's the example

Pada tanggal Sen, 30 Agu 2021 pukul 14.42 Pai Lee Wai < @.***> menulis:

@purnadi-winarno https://github.com/purnadi-winarno

can you please provide more information? For example, the code segment which having type error.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jk-gan/redux-flipper/issues/52#issuecomment-908112311, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADHDMZGLK6N3UC7O7IEDEP3T7MY6LANCNFSM5DAAYL3A . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

plwai commented 3 years ago

@purnadi-winarno your image is just a path.

purnadi-winarno commented 3 years ago

Ok, here I re-attach the image

when I try to use redux-logger, all is fine, but redux-logger not displayed well in flipper.

Unfortunately, when I try to use flipper-logger, the problem was came. Thanks for your help..

Pada tanggal Rab, 1 Sep 2021 pukul 10.11 Pai Lee Wai < @.***> menulis:

@purnadi-winarno https://github.com/purnadi-winarno your image is just a path.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jk-gan/redux-flipper/issues/52#issuecomment-909836714, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADHDMZFXVGVIABFX5ZIENPDT7WKWBANCNFSM5DAAYL3A . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

plwai commented 3 years ago

@purnadi-winarno

Sorry. Can you please provide the information clearly? Your image is still not showing as well.

purnadi-winarno commented 3 years ago

Pada tanggal Rab, 1 Sep 2021 pukul 12.27 Pai Lee Wai < @.***> menulis:

@purnadi-winarno https://github.com/purnadi-winarno

Sorry. Can you please provide the information clearly? Your image is still not showing as well.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jk-gan/redux-flipper/issues/52#issuecomment-909902922, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADHDMZHJHNK7U33F5KAWOPDT7W2UDANCNFSM5DAAYL3A . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

jk-gan commented 3 years ago

hi @purnadi-winarno, can you attach the image in Github instead of replying via email? we can't see your image for some reasons.

purnadi-winarno commented 3 years ago

I've attached my store.ts is it delivered? here's I attached the file again..

Pada tanggal Rab, 1 Sep 2021 pukul 14.37 Gan Jun Kai < @.***> menulis:

hi @purnadi-winarno https://github.com/purnadi-winarno, can you attach the image in Github instead of replying via email? we can't see your image for some reasons.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jk-gan/redux-flipper/issues/52#issuecomment-910021740, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADHDMZCRUH2A3HBVLWE4WRLT7XJ2ZANCNFSM5DAAYL3A . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

mi-chal commented 2 years ago

@purnadi-winarno Here's an example for store config that uses Redux-Saga but it can be applied for other middlewares:

import { configureStore, Middleware } from '@reduxjs/toolkit';
import createDebugger from 'redux-flipper';
import createSagaMiddleware from 'redux-saga';

import rootReducer from '@/store/rootReducer';
import rootSaga from '@/store/rootSaga';

const sagaMiddleware = createSagaMiddleware();

const middlewares: Middleware[] = [sagaMiddleware];

if (__DEV__) {
  const reduxFlipperDebugger = createDebugger();
  middlewares.push(reduxFlipperDebugger);
}

const store = configureStore({
  reducer: rootReducer,
  middleware: (getDefaultMiddleware) => [
    ...getDefaultMiddleware({
      thunk: false,
    }),
    ...middlewares,
  ],
});

sagaMiddleware.run(rootSaga);

export default store;

I hope it helps :)

MathisBarre commented 2 years ago

And here is an example with redux-toolkit :

import {configureStore, Middleware} from '@reduxjs/toolkit';
import userReducer from './user/userSlice';

const middlewares: Middleware[] = [];

if (__DEV__) {
  const createDebugger = require('redux-flipper').default;
  middlewares.push(createDebugger());
}

export const store = configureStore({
  reducer: {
    user: userReducer,
  },
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware().concat(middlewares),
});

export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;