README
Showsourcing front-end api
Features
- simple api
- local db
- search / filters
- synchronisation
- model generation
- logging
Overview
ApiClient is the entry point that generates all other services. Most of the time you'll work with the ApiClient.db which is the driver to access the local database.
- ApiClient: entry point, is responsible of configuration
- ApiDb: performs Crud operation on the local DB
- ApiSynchronizer: local synchronization with the server DB
- ApiCache: is responsible of cache access
Installation
The package is a wrapper above app sync. It does the configuration on its own and also exports the different services furnished by appsync. Therefor you don't need to configure, import or even install the followings: amplify
, app-sync
& apollo-client
.
You just need to npm i @cedric_showsourcing/showsourcing-frontend-api
Generate queries and mutations
amplify pull --appId d1c62vlrmdaq59 --envName antoine
amplify add codegen
amplify pull
amplify codegen
amplify codegen models
Usage
import { ApiClient } from '@cedric_showsourcing/showsourcing-frontend-api';
export const client = new ApiClient({
awsExport: environment.awsExport,
mutationMap: {
Product: { update: gql(updateProduct), create: gql(createProduct) }
},
syncMap: {
Product: {
base: {
query: gql(syncProducts),
__typename: 'ModelProductConnection'
}
}
}
});
client.sync();
export const db = client.db;
db.get('Product', 'some-id').subscribe(product => console.log(product));
db.find('Product').data$.subscribe(products => console.log(products));
client.Auth.signIn('augustin@showsourcing.com', 'Test1234').then(_ => {
client.synchronizer.sync();
});
ApiDB
Here are the methods of to perform operations on the DB
/** get one entity by id */
get(typename: string, id: string): Observable<any>
/**
* find entities in the cache
* @param typename: the type you want to find
* @param filters: recursive object to filter entities e.g. {and: [{property: 'name', contains: 'hello'}, ...]}
* @param pagination: the slice of entities e.g. {page: 0, limit: 25}
* @param sort: how the entities are sorted e.g. {direction: 'ASC', property: 'name'}
* @returns a single response (first()) trough an observable.
*/
find(
typename: string,
sort?: SortType,
filters?: FilterType,
pagination: PaginationType = { page: 0, limit: 25 }
): IApiResponse<any>
/** update many entities in backend and update the cache */
update(typename: string, entities: EntityFields[]): Observable<any[]>
/** delete many entities in backend and update the cache */
delete(typename: string, entities: any[]): Observable<any[]>
/** create many entities in backend and update the cache */
create(typename: string, entities: any[]): Observable<any[]>
Logging
Set log level
You can set the log level in the options of the client
export const client = new ApiClient({
awsExport: environment.awsExport,
logLevel: LogLevel.DEBUG,
// ...
});
Here are is the legend for logging:
/** colors */
const COLOR_LOCAL = 'color: gold; background: #3b2d44; padding: 4px';
const COLOR_LOCAL_RESPONSE = 'color: lime; background: #3b2d44; padding: 4px';
const COLOR_SERVER_RESPONSE = 'color: pink; background: #3b2d44; padding: 4px';
/** icons */
const iconQuery = '🍌';
const iconMutation = '🍇';
Scripts
build models from datastore models:
the src/generated/models
folder can be replaced with new models generated by amplify.
then the command line npm run models
should use the src/generated/models
to create a file in src/models/index.ts
with the models usable by the client.