@common-stack/mobile-stack-react 6.0.6-alpha.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +50 -0
- package/lib/config/base-apollo-cache.d.ts +16 -0
- package/lib/config/base-apollo-cache.js +35 -0
- package/lib/config/base-apollo-client.d.ts +20 -0
- package/lib/config/base-apollo-client.js +122 -0
- package/lib/config/base-redux-config.d.ts +24 -0
- package/lib/config/base-redux-config.js +48 -0
- package/lib/config/client.service.d.ts +9 -0
- package/lib/config/client.service.js +71 -0
- package/lib/config/env-config.d.ts +15 -0
- package/lib/config/epic-config.d.ts +3 -0
- package/lib/config/epic-config.js +8 -0
- package/lib/config/index.d.ts +2 -0
- package/lib/config/mobile-env-config.d.ts +7 -0
- package/lib/config/mobile-env-config.js +8 -0
- package/lib/config/redux-config.d.ts +26 -0
- package/lib/config/redux-config.js +49 -0
- package/lib/config/router-history.d.ts +2 -0
- package/lib/config/router-history.js +1 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.js +1 -0
- package/lib/modules.d.ts +4 -0
- package/lib/modules.js +3 -0
- package/lib/utils/index.d.ts +10 -0
- package/lib/utils/index.js +20 -0
- package/lib/utils/navigator.d.ts +1 -0
- package/lib/utils/navigator.js +5 -0
- package/package.json +135 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
The MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2017 CDMBase LLC.
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in
|
|
13
|
+
all copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
21
|
+
THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
# React Package
|
|
2
|
+
React components and containers
|
|
3
|
+
|
|
4
|
+
What does it include:
|
|
5
|
+
---
|
|
6
|
+
1. exported react pure components
|
|
7
|
+
2. exported react containers
|
|
8
|
+
3. Typescript 2.0.0 => ES6
|
|
9
|
+
4. unit testing with jest
|
|
10
|
+
|
|
11
|
+
Purpose:
|
|
12
|
+
---
|
|
13
|
+
This package can be installable in front-end webserver
|
|
14
|
+
|
|
15
|
+
Useful commands:
|
|
16
|
+
---
|
|
17
|
+
npm run build - build the library files
|
|
18
|
+
npm run test - run tests once
|
|
19
|
+
npm run test:watch - run tests in watchmode (Useful for development)
|
|
20
|
+
|
|
21
|
+
Files explained:
|
|
22
|
+
---
|
|
23
|
+
src - directory is used for typescript code that is part of the project
|
|
24
|
+
index.ts - Index file of the package. Consists of exported components and containers
|
|
25
|
+
index.spec.ts - Tests file for main
|
|
26
|
+
components - All pure components which don't depend on backend data or external state such as redux
|
|
27
|
+
index.ts - References all the exported components
|
|
28
|
+
containers - Components with data to render. Tightly coupled with redux.
|
|
29
|
+
index.ts - References all the exported containers
|
|
30
|
+
package.json - file is used to describe the library and packages that are required added under peer-dependencies section
|
|
31
|
+
tsconfig.json - configuration file for the library compilation
|
|
32
|
+
webpack.config.js - configuration file of the compilation automation process for the library
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
Tutorials:
|
|
36
|
+
---
|
|
37
|
+
[react-jest-enzymes test](https://www.youtube.com/watch?v=bMmntkVM4wQ)
|
|
38
|
+
|
|
39
|
+
[testing react with enzyme tutorial](http://codeheaven.io/testing-react-components-with-enzyme/)
|
|
40
|
+
|
|
41
|
+
[react-redux-typescript-guide](https://github.com/piotrwitek/react-redux-typescript-guide)
|
|
42
|
+
|
|
43
|
+
Performance:
|
|
44
|
+
---
|
|
45
|
+
[Redux FAQ: Connecting multiple components](http://redux.js.org/docs/FAQ.html#react-multiple-components)
|
|
46
|
+
|
|
47
|
+
[React/Redux Links: Performance articles](https://github.com/markerikson/react-redux-links/blob/master/react-performance.md)
|
|
48
|
+
|
|
49
|
+
[React/Redux: Component re-rendering too often?](http://redux.js.org/docs/faq/ReactRedux.html#react-rendering-too-often)
|
|
50
|
+
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { InMemoryCache } from '@apollo/client/cache/index.js';
|
|
2
|
+
import { CdmLogger } from '@cdm-logger/core';
|
|
3
|
+
interface CreateCacheParams {
|
|
4
|
+
getDataIdFromObject: (x?: any) => string;
|
|
5
|
+
clientState: any;
|
|
6
|
+
initialState?: any;
|
|
7
|
+
logger: CdmLogger.ILogger;
|
|
8
|
+
}
|
|
9
|
+
export declare const createCache: ({ getDataIdFromObject, clientState }: CreateCacheParams) => InMemoryCache;
|
|
10
|
+
export declare const initializeCache: ({ cache, initialState, clientState, logger, }: {
|
|
11
|
+
cache: InMemoryCache;
|
|
12
|
+
initialState?: any;
|
|
13
|
+
clientState: any;
|
|
14
|
+
logger: CdmLogger.ILogger;
|
|
15
|
+
}) => void;
|
|
16
|
+
export {};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import {InMemoryCache}from'@apollo/client/cache/index.js';// cache.ts
|
|
2
|
+
const createCache = ({ getDataIdFromObject, clientState }) => {
|
|
3
|
+
const cache = new InMemoryCache({
|
|
4
|
+
dataIdFromObject: getDataIdFromObject,
|
|
5
|
+
possibleTypes: clientState.possibleTypes,
|
|
6
|
+
typePolicies: clientState.typePolicies,
|
|
7
|
+
});
|
|
8
|
+
return cache;
|
|
9
|
+
};
|
|
10
|
+
const initializeCache = ({ cache, initialState, clientState, logger, }) => {
|
|
11
|
+
if (initialState) {
|
|
12
|
+
try {
|
|
13
|
+
cache.restore(initialState);
|
|
14
|
+
logger.debug('Cache restored with initial state');
|
|
15
|
+
}
|
|
16
|
+
catch (err) {
|
|
17
|
+
logger.error('Error restoring cache', err);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
clientState.defaults?.forEach((x) => {
|
|
22
|
+
try {
|
|
23
|
+
if (x.type === 'query') {
|
|
24
|
+
cache.writeQuery({ query: x.query, data: x.data });
|
|
25
|
+
}
|
|
26
|
+
else if (x.type === 'fragment') {
|
|
27
|
+
cache.writeFragment({ id: x.id, fragment: x.fragment, data: x.data });
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
catch (err) {
|
|
31
|
+
logger.error('Error writing to cache', err);
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
};export{createCache,initializeCache};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { ApolloClient } from '@apollo/client';
|
|
2
|
+
import { InMemoryCache } from '@apollo/client/cache';
|
|
3
|
+
import { CdmLogger } from '@cdm-logger/core';
|
|
4
|
+
interface IApolloClientParams {
|
|
5
|
+
initialState?: any;
|
|
6
|
+
scope: 'browser' | 'server' | 'native';
|
|
7
|
+
getDataIdFromObject: (x?: any) => string;
|
|
8
|
+
clientState: any;
|
|
9
|
+
isDebug: boolean;
|
|
10
|
+
isDev: boolean;
|
|
11
|
+
isSSR: boolean;
|
|
12
|
+
httpGraphqlURL: string;
|
|
13
|
+
httpLocalGraphqlURL: string;
|
|
14
|
+
logger: CdmLogger.ILogger;
|
|
15
|
+
}
|
|
16
|
+
export declare const createApolloClient: ({ scope, isDev, isDebug, isSSR, getDataIdFromObject, clientState, httpGraphqlURL, httpLocalGraphqlURL, initialState, logger, }: IApolloClientParams) => {
|
|
17
|
+
apolloClient: ApolloClient<any>;
|
|
18
|
+
cache: InMemoryCache;
|
|
19
|
+
};
|
|
20
|
+
export {};
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import {ApolloLink,ApolloClient}from'@apollo/client';import {HttpLink}from'@apollo/client/link/http';import {BatchHttpLink}from'@apollo/client/link/batch-http';import {onError}from'@apollo/client/link/error/index.js';import {GraphQLWsLink}from'@apollo/client/link/subscriptions';import {getOperationAST}from'graphql';import {invariant}from'ts-invariant';import fetch from'node-fetch';import {isBoolean,merge}from'lodash';import {RetryLink}from'@apollo/client/link/retry';import {createClient}from'graphql-ws';import {createCache,initializeCache}from'./base-apollo-cache.js';/* eslint-disable global-require */
|
|
2
|
+
// version 09/18/2021
|
|
3
|
+
/* eslint-disable import/no-extraneous-dependencies */
|
|
4
|
+
/* eslint-disable no-underscore-dangle */
|
|
5
|
+
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
|
|
6
|
+
const schema = `
|
|
7
|
+
|
|
8
|
+
`;
|
|
9
|
+
const errorLink = onError(({ graphQLErrors, networkError }) => {
|
|
10
|
+
if (graphQLErrors) {
|
|
11
|
+
graphQLErrors.map(({ message, locations, path }) => invariant.warn(`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`));
|
|
12
|
+
}
|
|
13
|
+
if (networkError) {
|
|
14
|
+
invariant.warn(`[Network error]: ${networkError}`);
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
const createApolloClient = ({ scope, isDev, isDebug, isSSR, getDataIdFromObject, clientState, httpGraphqlURL, httpLocalGraphqlURL, initialState, logger, }) => {
|
|
18
|
+
logger.debug('Initializing Apollo Client with parameters, {%o}', {
|
|
19
|
+
scope,
|
|
20
|
+
isDev,
|
|
21
|
+
isDebug,
|
|
22
|
+
isSSR,
|
|
23
|
+
httpGraphqlURL,
|
|
24
|
+
httpLocalGraphqlURL,
|
|
25
|
+
});
|
|
26
|
+
const isBrowser = scope === 'browser';
|
|
27
|
+
const isServer = scope === 'server';
|
|
28
|
+
const cache = createCache({ getDataIdFromObject, clientState, logger });
|
|
29
|
+
logger.debug('Created new Apollo memory cache');
|
|
30
|
+
const retryLink = new RetryLink({
|
|
31
|
+
attempts: async (count, operation, error) => {
|
|
32
|
+
logger.debug('Retrying link attempt', { count, operation, error });
|
|
33
|
+
const promises = (clientState.retryLinkAttemptFuncs || []).map((func) => func(count, operation, error));
|
|
34
|
+
try {
|
|
35
|
+
const result = await Promise.all(promises);
|
|
36
|
+
return !!result.find((item) => item && isBoolean(item));
|
|
37
|
+
}
|
|
38
|
+
catch (e) {
|
|
39
|
+
logger.error('Error occurred in retryLink attempt condition', e);
|
|
40
|
+
throw e;
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
});
|
|
44
|
+
let link;
|
|
45
|
+
if (isBrowser) {
|
|
46
|
+
const connectionParams = async () => {
|
|
47
|
+
logger.debug('Getting WebSocket connection parameters');
|
|
48
|
+
const param = {};
|
|
49
|
+
for (const connectionParam of clientState.connectionParams) {
|
|
50
|
+
const result = await connectionParam();
|
|
51
|
+
merge(param, await result());
|
|
52
|
+
}
|
|
53
|
+
return param;
|
|
54
|
+
};
|
|
55
|
+
const wsLink = new GraphQLWsLink(createClient({
|
|
56
|
+
url: httpGraphqlURL.replace(/^http/, 'ws'),
|
|
57
|
+
retryAttempts: 10,
|
|
58
|
+
lazy: true,
|
|
59
|
+
shouldRetry: () => true,
|
|
60
|
+
keepAlive: 10000,
|
|
61
|
+
connectionParams,
|
|
62
|
+
on: {
|
|
63
|
+
connected: (socket) => logger.debug('WebSocket connected'),
|
|
64
|
+
error: async (error) => {
|
|
65
|
+
logger.error(error, '[WS connectionCallback error] %j');
|
|
66
|
+
const promises = (clientState.connectionCallbackFuncs || []).map((func) => func(wsLink, error, {}));
|
|
67
|
+
try {
|
|
68
|
+
await Promise.all(promises);
|
|
69
|
+
}
|
|
70
|
+
catch (err) {
|
|
71
|
+
logger.trace('Error occurred in WebSocket connection callback', err);
|
|
72
|
+
throw err;
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
// connected: (socket, payload) => {}
|
|
76
|
+
ping: () => logger.trace('Ping sent'),
|
|
77
|
+
pong: () => logger.trace('Pong received'),
|
|
78
|
+
// inactivityTimeout: 10000,
|
|
79
|
+
},
|
|
80
|
+
}));
|
|
81
|
+
link = ApolloLink.split(({ query, operationName }) => {
|
|
82
|
+
if (operationName.endsWith('_WS')) {
|
|
83
|
+
return true;
|
|
84
|
+
}
|
|
85
|
+
const operationAST = getOperationAST(query, operationName);
|
|
86
|
+
return !!operationAST && operationAST.operation === 'subscription';
|
|
87
|
+
}, wsLink, new HttpLink({
|
|
88
|
+
uri: httpGraphqlURL,
|
|
89
|
+
}));
|
|
90
|
+
}
|
|
91
|
+
else if (isServer) {
|
|
92
|
+
link = new BatchHttpLink({ uri: httpLocalGraphqlURL, fetch: fetch });
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
link = new HttpLink({ uri: httpLocalGraphqlURL, fetch: fetch });
|
|
96
|
+
}
|
|
97
|
+
const links = [errorLink, retryLink, ...(clientState.preLinks || []), link];
|
|
98
|
+
const params = {
|
|
99
|
+
queryDeduplication: true,
|
|
100
|
+
typeDefs: schema.concat(clientState.typeDefs),
|
|
101
|
+
resolvers: clientState.resolvers,
|
|
102
|
+
link: ApolloLink.from(links),
|
|
103
|
+
cache,
|
|
104
|
+
credentials: 'include',
|
|
105
|
+
connectToDevTools: isBrowser && (isDev || isDebug),
|
|
106
|
+
};
|
|
107
|
+
if (isSSR) {
|
|
108
|
+
if (isBrowser) {
|
|
109
|
+
if (initialState) {
|
|
110
|
+
cache.restore(initialState);
|
|
111
|
+
}
|
|
112
|
+
params.ssrForceFetchDelay = 100;
|
|
113
|
+
}
|
|
114
|
+
else if (isServer) {
|
|
115
|
+
params.ssrMode = true;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
const apolloClient = new ApolloClient(params);
|
|
119
|
+
logger.debug('Created new Apollo client');
|
|
120
|
+
initializeCache({ cache, initialState, clientState, logger });
|
|
121
|
+
return { apolloClient, cache };
|
|
122
|
+
};export{createApolloClient};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { Middleware, StoreEnhancer } from 'redux';
|
|
2
|
+
import { EpicMiddleware, Epic } from 'redux-observable';
|
|
3
|
+
import { PersistConfig } from 'redux-persist';
|
|
4
|
+
interface IReduxStore<S = any> {
|
|
5
|
+
scope: 'browser' | 'server' | 'native' | 'ElectronMain';
|
|
6
|
+
isDebug: boolean;
|
|
7
|
+
isDev: boolean;
|
|
8
|
+
reducers: any;
|
|
9
|
+
enhancers?: StoreEnhancer[];
|
|
10
|
+
rootEpic: Epic<any, any, any, any>;
|
|
11
|
+
epicMiddleware?: EpicMiddleware<any, any, S, any>;
|
|
12
|
+
preMiddleware?: Middleware[];
|
|
13
|
+
postMiddleware?: Middleware[];
|
|
14
|
+
middleware?: Middleware[];
|
|
15
|
+
initialState?: any;
|
|
16
|
+
persistConfig?: PersistConfig<any>;
|
|
17
|
+
reduxConfig?: any;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Add any reducers required for this app dirctly in to
|
|
21
|
+
* `combineReducers`
|
|
22
|
+
*/
|
|
23
|
+
export declare const createReduxStore: ({ scope, isDebug, isDev, reducers, rootEpic, enhancers, epicMiddleware, preMiddleware, postMiddleware, middleware, initialState, persistConfig, reduxConfig, }: IReduxStore<any>) => import("@reduxjs/toolkit").Store<any, import("@reduxjs/toolkit").UnknownAction, unknown>;
|
|
24
|
+
export {};
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import {combineReducers,configureStore}from'@reduxjs/toolkit';import {persistReducer,FLUSH,REHYDRATE,PAUSE,PERSIST,PURGE,REGISTER}from'redux-persist';// version 11/12/2021
|
|
2
|
+
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
|
|
3
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
4
|
+
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
5
|
+
/* eslint-disable global-require */
|
|
6
|
+
/* eslint-disable no-underscore-dangle */
|
|
7
|
+
/**
|
|
8
|
+
* Add any reducers required for this app dirctly in to
|
|
9
|
+
* `combineReducers`
|
|
10
|
+
*/
|
|
11
|
+
const createReduxStore = ({ scope, isDebug, isDev, reducers, rootEpic, enhancers = [], epicMiddleware, preMiddleware = [], postMiddleware = [], middleware = [], initialState, persistConfig, reduxConfig, }) => {
|
|
12
|
+
const isBrowser = scope === 'browser';
|
|
13
|
+
const isElectronMain = scope === 'ElectronMain';
|
|
14
|
+
/**
|
|
15
|
+
* Add middleware that required for this app.
|
|
16
|
+
*/
|
|
17
|
+
const rootReducer = combineReducers(reducers);
|
|
18
|
+
const persistedReducer = persistConfig && isBrowser ? persistReducer(persistConfig, rootReducer) : rootReducer;
|
|
19
|
+
const middlewares = [
|
|
20
|
+
...preMiddleware,
|
|
21
|
+
...(epicMiddleware ? [epicMiddleware] : []),
|
|
22
|
+
...middleware,
|
|
23
|
+
...postMiddleware,
|
|
24
|
+
];
|
|
25
|
+
const store = configureStore({
|
|
26
|
+
reducer: persistedReducer,
|
|
27
|
+
middleware: (getDefaultMiddleware) => getDefaultMiddleware({
|
|
28
|
+
serializableCheck: {
|
|
29
|
+
ignoredActions: [
|
|
30
|
+
FLUSH,
|
|
31
|
+
REHYDRATE,
|
|
32
|
+
PAUSE,
|
|
33
|
+
PERSIST,
|
|
34
|
+
PURGE,
|
|
35
|
+
REGISTER,
|
|
36
|
+
...(reduxConfig?.ignoredActions || []),
|
|
37
|
+
],
|
|
38
|
+
},
|
|
39
|
+
}).concat(...middlewares),
|
|
40
|
+
devTools: isDev || isDebug,
|
|
41
|
+
preloadedState: initialState,
|
|
42
|
+
enhancers: (getDefaultEnhancers) => getDefaultEnhancers().concat(...enhancers),
|
|
43
|
+
});
|
|
44
|
+
if ((isBrowser || isElectronMain) && epicMiddleware && rootEpic) {
|
|
45
|
+
epicMiddleware.run(rootEpic);
|
|
46
|
+
}
|
|
47
|
+
return store;
|
|
48
|
+
};export{createReduxStore};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import 'reflect-metadata';
|
|
2
|
+
import { Container } from 'inversify';
|
|
3
|
+
import { ApolloClient } from '@apollo/client/index.js';
|
|
4
|
+
export declare const createClientContainer: (req?: any, res?: any) => {
|
|
5
|
+
container: Container;
|
|
6
|
+
apolloClient: ApolloClient<any>;
|
|
7
|
+
serviceFunc: () => any;
|
|
8
|
+
logger: import("@cdm-logger/core/lib/interface").ILogger;
|
|
9
|
+
};
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import'reflect-metadata';import {ClientTypes}from'@common-stack/client-core';import {ScopedContainer}from'@common-stack/client-core/lib/connector/ScopedContainer.js';import {merge}from'lodash-es';import features from'../modules.js';import {logger,UtilityClass}from'../utils/index.js';import {createApolloClient}from'./base-apollo-client.js';import {config}from'./mobile-env-config.js';const utility = new UtilityClass(features);
|
|
2
|
+
ScopedContainer.registerGlobalDependencies((container) => {
|
|
3
|
+
container.bind(ClientTypes.Logger).toConstantValue(logger);
|
|
4
|
+
container.bind(ClientTypes.UtilityClass).toConstantValue(utility);
|
|
5
|
+
});
|
|
6
|
+
const createClientContainer = (req, res) => {
|
|
7
|
+
logger.debug('Calling CreateClientContainer');
|
|
8
|
+
// const childContainer = container.createChild();
|
|
9
|
+
const container = features.createContainers({});
|
|
10
|
+
container
|
|
11
|
+
.bind(ClientTypes.ApolloClient)
|
|
12
|
+
.toDynamicValue((context) => new Error('Too early to bind ApolloClient'))
|
|
13
|
+
.inRequestScope();
|
|
14
|
+
container
|
|
15
|
+
.bind(ClientTypes.ApolloClientFactory)
|
|
16
|
+
.toDynamicValue((context) => () => {
|
|
17
|
+
const newClient = container.get(ClientTypes.ApolloClient);
|
|
18
|
+
return newClient;
|
|
19
|
+
});
|
|
20
|
+
const services = merge({ container }, ...features.createServiceFunc.map((serviceFunc) => serviceFunc(container)));
|
|
21
|
+
const clientState = features.getStateParams({
|
|
22
|
+
resolverContex: () => services,
|
|
23
|
+
// container: container,
|
|
24
|
+
requestResponsePair: {
|
|
25
|
+
req,
|
|
26
|
+
res,
|
|
27
|
+
},
|
|
28
|
+
});
|
|
29
|
+
const { apolloClient, cache } = createApolloClient({
|
|
30
|
+
httpGraphqlURL: config.GRAPHQL_URL,
|
|
31
|
+
httpLocalGraphqlURL: config.LOCAL_GRAPHQL_URL,
|
|
32
|
+
isDev: process.env.NODE_ENV === 'development',
|
|
33
|
+
isDebug: __DEBUGGING__,
|
|
34
|
+
isSSR: __SSR__,
|
|
35
|
+
scope: typeof window !== 'undefined' ? 'browser' : 'server',
|
|
36
|
+
clientState,
|
|
37
|
+
getDataIdFromObject: (result) => features.getDataIdFromObject(result),
|
|
38
|
+
initialState: typeof window !== 'undefined' ? window?.__APOLLO_STATE__ : undefined,
|
|
39
|
+
logger,
|
|
40
|
+
});
|
|
41
|
+
if (!container.isBound(ClientTypes.InMemoryCache)) {
|
|
42
|
+
container
|
|
43
|
+
.bind(ClientTypes.InMemoryCache)
|
|
44
|
+
.toDynamicValue((context) => cache)
|
|
45
|
+
.inRequestScope();
|
|
46
|
+
}
|
|
47
|
+
container
|
|
48
|
+
.rebind(ClientTypes.ApolloClient)
|
|
49
|
+
.toDynamicValue((context) => apolloClient)
|
|
50
|
+
.inRequestScope();
|
|
51
|
+
// const services = serviceFunc();
|
|
52
|
+
const serviceFunc = () => services;
|
|
53
|
+
apolloClient.container = services;
|
|
54
|
+
const clientService = {
|
|
55
|
+
container,
|
|
56
|
+
apolloClient,
|
|
57
|
+
serviceFunc,
|
|
58
|
+
logger,
|
|
59
|
+
};
|
|
60
|
+
if (module.hot) {
|
|
61
|
+
module.hot.dispose(() => {
|
|
62
|
+
// Force Apollo to fetch the latest data from the server
|
|
63
|
+
delete window.__APOLLO_STATE__;
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
if (typeof window !== 'undefined') {
|
|
67
|
+
//@ts-ignore
|
|
68
|
+
window.__CLIENT_SERVICE__ = clientService;
|
|
69
|
+
}
|
|
70
|
+
return clientService;
|
|
71
|
+
};export{createClientContainer};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export declare const config: Readonly<{
|
|
2
|
+
CLIENT_URL: string;
|
|
3
|
+
LAYOUT_SETTINGS: {
|
|
4
|
+
navTheme: string;
|
|
5
|
+
primaryColor: string;
|
|
6
|
+
layout: string;
|
|
7
|
+
contentWidth: string;
|
|
8
|
+
fixedHeader: boolean;
|
|
9
|
+
fixSiderbar: boolean;
|
|
10
|
+
colorWeak: boolean;
|
|
11
|
+
title: string;
|
|
12
|
+
iconfontUrl: string;
|
|
13
|
+
language: string;
|
|
14
|
+
};
|
|
15
|
+
} & import("envalid").CleanedEnvAccessors>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import {combineEpics,ofType}from'redux-observable';import {BehaviorSubject}from'rxjs';import {mergeMap,takeUntil}from'rxjs/operators/index.js';import features from'../modules.js';/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
|
2
|
+
/* eslint-disable @typescript-eslint/no-unsafe-call */
|
|
3
|
+
const epic$ = new BehaviorSubject(combineEpics(...features.epics));
|
|
4
|
+
// Since we're using mergeMap, by default any new
|
|
5
|
+
// epic that comes in will be merged into the previous
|
|
6
|
+
// one, unless an EPIC_END action is dispatched first,
|
|
7
|
+
// which would cause the old one(s) to be unsubscribed
|
|
8
|
+
const rootEpic = (action$, ...rest) => epic$.pipe(mergeMap((epic) => epic(action$, ...rest).pipe(takeUntil(action$.pipe(ofType('EPIC_END'))))));export{epic$,rootEpic};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import {cleanEnv,str}from'envalid';import {getEnvironment}from'@common-stack/core';const env = getEnvironment();
|
|
2
|
+
const config = cleanEnv(env, {
|
|
3
|
+
GA_ID: str({ devDefault: 'G-xxxxxxx' }),
|
|
4
|
+
GRAPHQL_URL: str({ devDefault: __GRAPHQL_URL__ }),
|
|
5
|
+
LOCAL_GRAPHQL_URL: str({ default: __GRAPHQL_URL__ }),
|
|
6
|
+
GRAPHQL_SUBSCRIPTION_URL: str({ default: env?.GRAPHQL_URL?.replace(/^http/, 'ws') }),
|
|
7
|
+
LOG_LEVEL: str({ devDefault: 'debug' }),
|
|
8
|
+
});export{config};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2';
|
|
2
|
+
import history from './router-history';
|
|
3
|
+
export { history };
|
|
4
|
+
export declare const epicMiddlewareFunc: (apolloClient: any, services: any, container: any) => import("redux-observable").EpicMiddleware<import("redux").Action<any>, import("redux").Action<any>, void, {
|
|
5
|
+
apolloClient: any;
|
|
6
|
+
routes: any;
|
|
7
|
+
services: any;
|
|
8
|
+
container: any;
|
|
9
|
+
logger: import("@cdm-logger/core/lib/interface").ILogger;
|
|
10
|
+
config: {
|
|
11
|
+
isMobile: boolean;
|
|
12
|
+
};
|
|
13
|
+
}>;
|
|
14
|
+
export declare const persistConfig: {
|
|
15
|
+
key: string;
|
|
16
|
+
storage: import("@react-native-async-storage/async-storage").AsyncStorageStatic;
|
|
17
|
+
stateReconciler: typeof autoMergeLevel2;
|
|
18
|
+
transforms: any[];
|
|
19
|
+
};
|
|
20
|
+
/**
|
|
21
|
+
* Add any reducers required for this app dirctly in to
|
|
22
|
+
* `combineReducers`
|
|
23
|
+
*/
|
|
24
|
+
export declare const createReduxStore: (history: any, apolloClient: any, services: any, container: any) => {
|
|
25
|
+
store: import("@reduxjs/toolkit").Store<any, import("@reduxjs/toolkit").UnknownAction, unknown>;
|
|
26
|
+
};
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import storage from'@react-native-async-storage/async-storage';import autoMergeLevel2 from'redux-persist/lib/stateReconciler/autoMergeLevel2';import {createEpicMiddleware}from'redux-observable';import {REDUX_PERSIST_KEY}from'@common-stack/client-core';import {createReduxStore as createReduxStore$1}from'./base-redux-config.js';import features from'../modules.js';import {rootEpic}from'./epic-config.js';export{default as history}from'./router-history.js';import {logger}from'../utils/index.js';const epicMiddlewareFunc = (apolloClient, services, container) => createEpicMiddleware({
|
|
2
|
+
dependencies: {
|
|
3
|
+
apolloClient,
|
|
4
|
+
routes: features.getConfiguredRoutes(),
|
|
5
|
+
services,
|
|
6
|
+
container,
|
|
7
|
+
logger,
|
|
8
|
+
config: {
|
|
9
|
+
isMobile: true,
|
|
10
|
+
},
|
|
11
|
+
},
|
|
12
|
+
});
|
|
13
|
+
const persistConfig = {
|
|
14
|
+
key: REDUX_PERSIST_KEY,
|
|
15
|
+
storage,
|
|
16
|
+
stateReconciler: autoMergeLevel2,
|
|
17
|
+
transforms: features.reduxPersistStateTransformers,
|
|
18
|
+
};
|
|
19
|
+
/**
|
|
20
|
+
* Add any reducers required for this app dirctly in to
|
|
21
|
+
* `combineReducers`
|
|
22
|
+
*/
|
|
23
|
+
const createReduxStore = (history, apolloClient, services, container) => {
|
|
24
|
+
// middleware
|
|
25
|
+
const store = createReduxStore$1({
|
|
26
|
+
scope: 'browser',
|
|
27
|
+
isDebug: __DEBUGGING__,
|
|
28
|
+
isDev: process.env.NODE_ENV === 'development',
|
|
29
|
+
initialState: {},
|
|
30
|
+
persistConfig,
|
|
31
|
+
middleware: [],
|
|
32
|
+
epicMiddleware: epicMiddlewareFunc(apolloClient, services, container),
|
|
33
|
+
rootEpic: rootEpic,
|
|
34
|
+
reducers: { ...features.reducers },
|
|
35
|
+
});
|
|
36
|
+
if (container.isBound('ReduxStore')) {
|
|
37
|
+
container
|
|
38
|
+
.rebind('ReduxStore')
|
|
39
|
+
.toDynamicValue(() => store)
|
|
40
|
+
.inRequestScope();
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
container
|
|
44
|
+
.bind('ReduxStore')
|
|
45
|
+
.toDynamicValue(() => store)
|
|
46
|
+
.inRequestScope();
|
|
47
|
+
}
|
|
48
|
+
return { store };
|
|
49
|
+
};export{createReduxStore,epicMiddlewareFunc,persistConfig};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import {createMemoryHistory}from'history';const hist = createMemoryHistory();export{hist as default};
|
package/lib/index.d.ts
ADDED
package/lib/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{createClientContainer}from'./config/client.service.js';export{createReduxStore,epicMiddlewareFunc,persistConfig}from'./config/redux-config.js';export{UtilityClass,logger}from'./utils/index.js';export{default as history}from'./config/router-history.js';
|
package/lib/modules.d.ts
ADDED
package/lib/modules.js
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import modules from '../modules';
|
|
2
|
+
export declare class UtilityClass {
|
|
3
|
+
private modules;
|
|
4
|
+
constructor(modules: any);
|
|
5
|
+
getCacheKey(storeObj: any): any;
|
|
6
|
+
navigate(name: string, params: never): void;
|
|
7
|
+
}
|
|
8
|
+
declare const logger: import("@cdm-logger/core/lib/interface").ILogger;
|
|
9
|
+
export default modules;
|
|
10
|
+
export { logger };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import {ClientLogger}from'@cdm-logger/client';export{default}from'../modules.js';import {navigate}from'./navigator.js';/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
|
+
/* eslint-disable import/no-cycle */
|
|
3
|
+
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
4
|
+
Object.assign(global, require('../../build.config'));
|
|
5
|
+
class UtilityClass {
|
|
6
|
+
modules;
|
|
7
|
+
// tslint:disable-next-line:no-shadowed-variable
|
|
8
|
+
constructor(modules) {
|
|
9
|
+
this.modules = modules;
|
|
10
|
+
}
|
|
11
|
+
getCacheKey(storeObj) {
|
|
12
|
+
return this.modules.getDataIdFromObject(storeObj);
|
|
13
|
+
}
|
|
14
|
+
navigate(name, params) {
|
|
15
|
+
return navigate(name, params);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
const logger = ClientLogger.create(process.env.APP_NAME || 'Fullstack-Pro', {
|
|
19
|
+
level: process.env.LOG_LEVEL || 'info',
|
|
20
|
+
});export{UtilityClass,logger};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function navigate(name: string, params: never): void;
|
package/package.json
ADDED
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@common-stack/mobile-stack-react",
|
|
3
|
+
"version": "6.0.6-alpha.7",
|
|
4
|
+
"description": "Client Module for mobile app",
|
|
5
|
+
"homepage": "https://github.com/cdmbase/fullstack-pro#readme",
|
|
6
|
+
"bugs": {
|
|
7
|
+
"url": "https://github.com/cdmbase/fullstack-pro/issues"
|
|
8
|
+
},
|
|
9
|
+
"repository": {
|
|
10
|
+
"type": "git",
|
|
11
|
+
"url": "git+https://github.com/cdmbase/fullstack-pro.git"
|
|
12
|
+
},
|
|
13
|
+
"license": "ISC",
|
|
14
|
+
"author": "CDMBase LLC",
|
|
15
|
+
"type": "module",
|
|
16
|
+
"main": "lib/index.js",
|
|
17
|
+
"module": "lib/index.js",
|
|
18
|
+
"typings": "lib/index.d.ts",
|
|
19
|
+
"scripts": {
|
|
20
|
+
"build": "npm run build:clean && npm run build:lib",
|
|
21
|
+
"build:clean": "rimraf lib",
|
|
22
|
+
"build:lib": "rollup -c rollup.config.mjs",
|
|
23
|
+
"build:lib:watch": "npm run build:lib -- --watch",
|
|
24
|
+
"jest": "./node_modules/.bin/jest",
|
|
25
|
+
"prepublish": "npm run build",
|
|
26
|
+
"test": "jest",
|
|
27
|
+
"test:debug": "npm test -- --runInBand",
|
|
28
|
+
"test:watch": "npm test -- --watch",
|
|
29
|
+
"watch": "npm run build:lib:watch"
|
|
30
|
+
},
|
|
31
|
+
"dependencies": {
|
|
32
|
+
"@apollo/client": "^3.9.0",
|
|
33
|
+
"@cdm-logger/client": "^9.0.3",
|
|
34
|
+
"@common-stack/client-core": "6.0.6-alpha.5",
|
|
35
|
+
"@common-stack/client-react": "6.0.6-alpha.5",
|
|
36
|
+
"@common-stack/components-pro": "6.0.6-alpha.5",
|
|
37
|
+
"@common-stack/core": "6.0.6-alpha.5",
|
|
38
|
+
"@expo/vector-icons": "~13.0.0",
|
|
39
|
+
"@react-native-async-storage/async-storage": "1.18.2",
|
|
40
|
+
"@react-native-community/datetimepicker": "7.2.0",
|
|
41
|
+
"@react-native-community/masked-view": "~0.1.10",
|
|
42
|
+
"@react-native-community/segmented-control": "~2.2.2",
|
|
43
|
+
"@react-navigation/bottom-tabs": "~6.5.9",
|
|
44
|
+
"@react-navigation/drawer": "~6.6.4",
|
|
45
|
+
"@react-navigation/native": "~6.1.8",
|
|
46
|
+
"@react-navigation/native-stack": "~6.9.14",
|
|
47
|
+
"@react-navigation/stack": "~6.3.18",
|
|
48
|
+
"@reduxjs/toolkit": "^2.2.6",
|
|
49
|
+
"apollo-link-debounce": "^3.0.0",
|
|
50
|
+
"apollo-link-logger": "^2.0.0",
|
|
51
|
+
"apollo-server-errors": "^3.3.1",
|
|
52
|
+
"big-integer": "^1.6.51",
|
|
53
|
+
"cross-fetch": "^4.0.0",
|
|
54
|
+
"envalid": "~7.2.2",
|
|
55
|
+
"expo": "~49.0.20",
|
|
56
|
+
"expo-apple-authentication": "~6.1.0",
|
|
57
|
+
"expo-asset": "~8.10.1",
|
|
58
|
+
"expo-auth-session": "~5.0.2",
|
|
59
|
+
"expo-build-properties": "~0.8.3",
|
|
60
|
+
"expo-constants": "~14.4.2",
|
|
61
|
+
"expo-dev-client": "~2.4.13",
|
|
62
|
+
"expo-device": "~5.4.0",
|
|
63
|
+
"expo-file-system": "~15.4.5",
|
|
64
|
+
"expo-image-picker": "~14.3.2",
|
|
65
|
+
"expo-linking": "~5.0.2",
|
|
66
|
+
"expo-localization": "~14.3.0",
|
|
67
|
+
"expo-notifications": "~0.20.1",
|
|
68
|
+
"expo-random": "~13.2.0",
|
|
69
|
+
"expo-secure-store": "~12.3.1",
|
|
70
|
+
"expo-splash-screen": "~0.20.5",
|
|
71
|
+
"expo-status-bar": "~1.6.0",
|
|
72
|
+
"expo-updates": "~0.18.19",
|
|
73
|
+
"expo-web-browser": "~12.3.2",
|
|
74
|
+
"graphql-ws": "^5.11.2",
|
|
75
|
+
"history": "^4.10.1",
|
|
76
|
+
"immutability-helper": "^3.0.1",
|
|
77
|
+
"inversify": "^6.0.2",
|
|
78
|
+
"isomorphic-fetch": "^2.2.1",
|
|
79
|
+
"lodash": "^4.17.15",
|
|
80
|
+
"metro-minify-terser": "^0.56.0",
|
|
81
|
+
"minilog": "^3.1.0",
|
|
82
|
+
"prop-types": "^15.8.1",
|
|
83
|
+
"query-string": "^9.0.0",
|
|
84
|
+
"ramda": "^0.26.1",
|
|
85
|
+
"react": "18.2.0",
|
|
86
|
+
"react-dom": "18.2.0",
|
|
87
|
+
"react-helmet": "^6.1.0",
|
|
88
|
+
"react-native": "0.72.10",
|
|
89
|
+
"react-native-confirmation-code-field": "7.3.1",
|
|
90
|
+
"react-native-dotenv": "^3.3.1",
|
|
91
|
+
"react-native-gesture-handler": "~2.12.0",
|
|
92
|
+
"react-native-get-random-values": "~1.9.0",
|
|
93
|
+
"react-native-keyboard-aware-scroll-view": "^0.9.3",
|
|
94
|
+
"react-native-keyboard-spacer": "^0.4.1",
|
|
95
|
+
"react-native-maps": "1.7.1",
|
|
96
|
+
"react-native-mime-types": "^2.3.0",
|
|
97
|
+
"react-native-modal": "^11.6.1",
|
|
98
|
+
"react-native-pager-view": "6.2.0",
|
|
99
|
+
"react-native-reanimated": "~3.3.0",
|
|
100
|
+
"react-native-safe-area-context": "4.6.3",
|
|
101
|
+
"react-native-screens": "~3.22.0",
|
|
102
|
+
"react-native-svg": "13.9.0",
|
|
103
|
+
"react-native-tab-view": "^3.5.2",
|
|
104
|
+
"react-native-tags": "2.2.1",
|
|
105
|
+
"react-native-url-polyfill": "^2.0.0",
|
|
106
|
+
"react-native-web": "~0.19.6",
|
|
107
|
+
"react-native-web-maps": "~0.3.0",
|
|
108
|
+
"react-redux": "^9.1.1",
|
|
109
|
+
"redux": "^4.0.5",
|
|
110
|
+
"redux-logger": "^3.0.6",
|
|
111
|
+
"redux-observable": "^1.2.0",
|
|
112
|
+
"redux-persist": "^6.0.0",
|
|
113
|
+
"redux-thunk": "^2.3.0",
|
|
114
|
+
"reflect-metadata": "^0.1.13",
|
|
115
|
+
"reselect": "^4.0.0",
|
|
116
|
+
"rxjs": "^6.5.3",
|
|
117
|
+
"rxjs-compat": "^6.5.3",
|
|
118
|
+
"rxjs-hooks": "^0.5.2",
|
|
119
|
+
"sentry-expo": "~7.1.0",
|
|
120
|
+
"subscriptions-transport-ws": "0.9.18",
|
|
121
|
+
"text-encoding-polyfill": "^0.6.7"
|
|
122
|
+
},
|
|
123
|
+
"peerDependencies": {
|
|
124
|
+
"@apollo/client": ">=3.0.0",
|
|
125
|
+
"react": ">=18",
|
|
126
|
+
"react-dom": ">=18"
|
|
127
|
+
},
|
|
128
|
+
"publishConfig": {
|
|
129
|
+
"access": "public"
|
|
130
|
+
},
|
|
131
|
+
"typescript": {
|
|
132
|
+
"definition": "lib/index.d.ts"
|
|
133
|
+
},
|
|
134
|
+
"gitHead": "054c57aa81115c5f531c5677e1e7933f8464df16"
|
|
135
|
+
}
|