getting flow diff

src/constants/api.ts

@@ -1,28 +1,29 @@
-import { INode } from '~/redux/types';
+import { INode } from "~/redux/types";
 
 export const API = {
   BASE: process.env.API_HOST,
   USER: {
-    LOGIN: '/user/login',
+    LOGIN: "/user/login",
     VKONTAKTE_LOGIN: `${process.env.API_HOST}/user/vkontakte`,
-    ME: '/user/',
+    ME: "/user/",
     PROFILE: (username: string) => `/user/${username}/profile`,
     MESSAGES: (username: string) => `/user/${username}/messages`,
     MESSAGE_SEND: (username: string) => `/user/${username}/messages`,
-    GET_UPDATES: '/user/updates',
+    GET_UPDATES: "/user/updates",
 
-    UPLOAD: (target, type) => `/upload/${target}/${type}`,
+    UPLOAD: (target, type) => `/upload/${target}/${type}`
   },
   NODE: {
-    SAVE: '/node/',
+    SAVE: "/node/",
-    GET: '/node/',
+    GET: "/node/",
+    GET_DIFF: "/node/diff",
     GET_NODE: (id: number | string) => `/node/${id}`,
 
-    COMMENT: (id: INode['id']) => `/node/${id}/comment`,
+    COMMENT: (id: INode["id"]) => `/node/${id}/comment`,
-    RELATED: (id: INode['id']) => `/node/${id}/related`,
+    RELATED: (id: INode["id"]) => `/node/${id}/related`,
-    UPDATE_TAGS: (id: INode['id']) => `/node/${id}/tags`,
+    UPDATE_TAGS: (id: INode["id"]) => `/node/${id}/tags`,
-    POST_LIKE: (id: INode['id']) => `/node/${id}/like`,
+    POST_LIKE: (id: INode["id"]) => `/node/${id}/like`,
-    POST_STAR: (id: INode['id']) => `/node/${id}/heroic`,
+    POST_STAR: (id: INode["id"]) => `/node/${id}/heroic`,
-    SET_CELL_VIEW: (id: INode['id']) => `/node/${id}/cell-view`,
+    SET_CELL_VIEW: (id: INode["id"]) => `/node/${id}/cell-view`
-  },
+  }
 };

src/redux/flow/sagas.ts

@@ -8,7 +8,7 @@ import {
 } from "redux-saga/effects";
 import { REHYDRATE } from "redux-persist";
 import { FLOW_ACTIONS } from "./constants";
-import { getNodes } from "../node/api";
+import { getNodes, getNodeDiff } from "../node/api";
 import {
   flowSetNodes,
   flowSetCellView,
@@ -22,6 +22,8 @@ import { selectFlowNodes } from "./selectors";
 import { reqWrapper } from "../auth/sagas";
 import { postCellView } from "./api";
 import { IFlowState } from "./reducer";
+import uniqBy from "ramda/es/uniqBy";
+import uniq from "ramda/es/uniq";
 
 function* onGetFlow() {
   yield put(flowSetFlow({ is_loading: true }));
@@ -57,18 +59,24 @@ function* onSetCellView({ id, flow }: ReturnType<typeof flowSetCellView>) {
 function* getMore() {
   yield put(flowSetFlow({ is_loading: true }));
   const nodes: IFlowState["nodes"] = yield select(selectFlowNodes);
-  const from =
+
+  const start = nodes && nodes[0] && nodes[0].created_at;
+  const end =
     nodes && nodes[nodes.length - 1] && nodes[nodes.length - 1].created_at;
 
-  const { error, data } = yield call(reqWrapper, getNodes, { from });
+  const { error, data } = yield call(reqWrapper, getNodeDiff, { start, end });
 
-  if (error || !data || !data.nodes) return;
+  if (error || !data) return;
 
-  yield put(
+  const result = uniq([
-    flowSetFlow({ is_loading: false, nodes: [...nodes, ...data.nodes] })
+    ...(data.before || []),
-  );
+    ...nodes,
+    ...(data.after || [])
+  ]);
 
-  yield delay(data.nodes.length > 0 ? 2000 : 30000);
+  yield put(flowSetFlow({ is_loading: false, nodes: result }));
+
+  yield delay(1000);
 }
 
 export default function* nodeSaga() {

src/redux/node/api.ts

@@ -34,6 +34,25 @@ export const getNodes = ({
     .then(resultMiddleware)
     .catch(errorMiddleware);
 
+export const getNodeDiff = ({
+  start = null,
+  end = null,
+  take,
+  access
+}: {
+  start?: string;
+  end?: string;
+  take?: number;
+  access: string;
+}): Promise<IResultWithStatus<{ nodes: INode[] }>> =>
+  api
+    .get(
+      API.NODE.GET_DIFF,
+      configWithToken(access, { params: { start, end, take } })
+    )
+    .then(resultMiddleware)
+    .catch(errorMiddleware);
+
 export const getNode = ({
   id,
   access

src/redux/store.ts

@@ -43,6 +43,12 @@ const authPersistConfig: PersistConfig = {
   storage
 };
 
+const flowPersistConfig: PersistConfig = {
+  key: "flow",
+  whitelist: ["nodes"],
+  storage
+};
+
 export interface IState {
   auth: IAuthState;
   modal: IModalState;
@@ -76,7 +82,7 @@ export const store = createStore(
     router: connectRouter(history),
     node: nodeReducer,
     uploads: uploadReducer,
-    flow: flowReducer,
+    flow: persistReducer(flowPersistConfig, flowReducer),
     player: playerReducer
   }),
   composeEnhancers(applyMiddleware(routerMiddleware(history), sagaMiddleware))