diff --git a/.angular-cli.json b/.angular-cli.json index 916ab664..aef34c75 100644 --- a/.angular-cli.json +++ b/.angular-cli.json @@ -21,7 +21,8 @@ "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ - "styles.scss" + "styles.scss", + "../node_modules/font-awesome/css/font-awesome.css" ], "scripts": [], "environmentSource": "environments/environment.ts", diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 00000000..c40b9a52 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,19 @@ +{ + "version": "0.1.0", + "configurations": [ + { + "name": "Launch localhost", + "type": "chrome", + "request": "launch", + "url": "http://localhost:4200", + "webRoot": "${workspaceRoot}/wwwroot" + }, + { + "name": "Launch index.html (disable sourcemaps)", + "type": "chrome", + "request": "launch", + "sourceMaps": false, + "file": "${workspaceRoot}/index.html" + } + ] +} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..fb5cd63c --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,21 @@ +{ + "typescript.check.workspaceVersion": false, + "files.exclude": { + "**/.git": true, + "**/.svn": true, + "**/.hg": true, + "**/.DS_Store": true, + // "node_modules": true, + "bin": true, + "obj": true, + "dist": true, + "Properties": true, + ".vs": true, + "*.csproj": true, + "*.sln": true, + "*.csproj.user": true, + "*.suo": true, + ".docker": false, + "docs": false + } +} diff --git a/package.json b/package.json index f3b4cd96..a605c451 100644 --- a/package.json +++ b/package.json @@ -4,31 +4,32 @@ "license": "MIT", "scripts": { "ng": "./node_modules/@angular/cli/bin/ng", - "start-mock": "ng serve -H 0.0.0.0 --environment=mock", + "start:mock": "ng serve -H 0.0.0.0 --environment=mock", "start": "ng serve -H 0.0.0.0", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "compodoc": "./node_modules/.bin/compodoc -p src/tsconfig.app.json -d docs/", - "build--prod": "ng build --prod --no-sourcemap --stats-json && npm run sw", + "build:prod": "ng build --prod --no-sourcemap --stats-json && npm run sw", "sw": "sw-precache --root=dist --config=sw-precache-config.js", "static-serve": "cd dist && live-server --port=4200 --host=localhost --entry-file=/index.html" }, "private": true, "dependencies": { - "@angular/animations": "^4.2.6", - "@angular/common": "^4.2.6", - "@angular/compiler": "^4.2.6", - "@angular/core": "^4.2.6", - "@angular/forms": "^4.2.6", - "@angular/http": "^4.2.6", - "@angular/platform-browser": "^4.2.6", - "@angular/platform-browser-dynamic": "^4.2.6", - "@angular/router": "^4.2.6", - "@ngrx/core": "^1.2.0", - "@ngrx/effects": "^2.0.4", - "@ngrx/store": "^2.2.1", + "@angular/animations": "^5.1.0", + "@angular/common": "^5.1.0", + "@angular/compiler": "^5.1.0", + "@angular/core": "^5.1.0", + "@angular/forms": "^5.1.0", + "@angular/http": "^5.1.0", + "@angular/platform-browser": "^5.1.0", + "@angular/platform-browser-dynamic": "^5.1.0", + "@angular/router": "^5.1.0", + "@ngrx/core": "1.2.0", + "@ngrx/effects": "^4.1.1", + "@ngrx/router-store": "^4.1.1", + "@ngrx/store": "^4.1.1", "bootstrap": "^3.3.7", "bootstrap-sass": "^3.3.7", "core-js": "^2.4.1", @@ -36,38 +37,39 @@ "immutable": "^3.8.1", "ngx-bootstrap": "^1.7.1", "reselect": "^2.5.4", - "rxjs": "^5.3.0", - "zone.js": "0.8.7" + "rxjs": "^5.5.2", + "zone.js": "^0.8.14" }, "devDependencies": { - "@angular/cli": "^1.1.2", - "@angular/compiler-cli": "^4.2.6", + "@angular/cli": "^1.5.0", + "@angular/compiler-cli": "^5.1.0", + "@angular/language-service": "^5.0.0", "@angularclass/hmr": "^1.2.2", "@compodoc/compodoc": "^1.0.0-beta.8", - "@ngrx/store-devtools": "^3.2.3", + "@ngrx/store-devtools": "^4.1.1", "@types/grecaptcha": "^2.0.31", "@types/jasmine": "2.5.38", "@types/morris.js": "^0.5.6", "@types/node": "~6.0.60", "codelyzer": "^2.0.1", - "jasmine-core": "^2.5.2", - "jasmine-spec-reporter": "^3.2.0", - "karma": "^1.4.1", - "karma-chrome-launcher": "^2.0.0", - "karma-cli": "^1.0.1", - "karma-coverage-istanbul-reporter": "^0.2.3", - "karma-jasmine": "^1.1.0", + "jasmine-core": "~2.6.2", + "jasmine-spec-reporter": "~4.1.0", + "karma": "~1.7.0", + "karma-chrome-launcher": "~2.1.1", + "karma-cli": "~1.0.1", + "karma-coverage-istanbul-reporter": "^1.2.1", + "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "ngrx-store-freeze": "^0.1.9", "node-sass": "^4.5.0", "nswag": "10.6.0", - "protractor": "^5.1.1", + "protractor": "~5.1.2", "raw-loader": "^0.5.1", "sass-loader": "^6.0.3", "sw-precache": "^5.0.0", - "ts-node": "^1.7.2", - "tslint": "^4.5.1", - "typescript": "2.3" + "ts-node": "~3.2.0", + "tslint": "~5.7.0", + "typescript": "~2.4.2" }, "description": "Spree for Angular2", "main": "index.js", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index e0238689..2f227bbd 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,8 +1,11 @@ +import { EffectsModule } from '@ngrx/effects'; +import { environment } from './../environments/environment.prod'; import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; -import { RouterModule } from '@angular/router'; +import { RouterModule, PreloadAllModules } from '@angular/router'; +import { StoreDevtoolsModule } from '@ngrx/store-devtools'; // Components import { AppComponent } from './app.component'; @@ -15,7 +18,7 @@ import { HomeModule } from './home/index'; import { LayoutModule } from './layout/index'; import { CoreModule } from './core/index'; import { StoreModule } from '@ngrx/store'; -import { reducer } from './app.reducers'; +import { reducers, metaReducers } from './app.reducers'; import { CheckoutHeaderComponent } from './layout/checkout-header/checkout-header.component'; import { CheckoutFooterComponent } from './layout/checkout-footer/checkout-footer.component'; @@ -35,8 +38,30 @@ import 'rxjs/add/observable/of'; CheckoutFooterComponent ], imports: [ - RouterModule.forRoot(routes), - StoreModule.provideStore(reducer), + RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules }), + StoreModule.forRoot(reducers, { metaReducers }), + + /** + * Store devtools instrument the store retaining past versions of state + * and recalculating new states. This enables powerful time-travel + * debugging. + * + * To use the debugger, install the Redux Devtools extension for either + * Chrome or Firefox + * + * See: https://github.com/zalmoxisus/redux-devtools-extension + */ + !environment.production ? StoreDevtoolsModule.instrument() : [], + + /** + * EffectsModule.forRoot() is imported once in the root module and + * sets up the effects class to be initialized immediately when the + * application starts. + * + * See: https://github.com/ngrx/platform/blob/master/docs/effects/api.md#forroot + */ + EffectsModule.forRoot([]), + BrowserModule, FormsModule, HttpModule, diff --git a/src/app/app.reducers.ts b/src/app/app.reducers.ts index 374a6797..0ce07d17 100644 --- a/src/app/app.reducers.ts +++ b/src/app/app.reducers.ts @@ -1,10 +1,9 @@ -import { searchReducer } from './home/reducers/search.reducers'; import { environment } from './../environments/environment'; -import { productReducer } from './product/reducers/product-reducer'; +import * as fromProduct from './product/reducers/product-reducer'; import { ProductState } from './product/reducers/product-state'; -import { userReducer } from './user/reducers/user.reducer'; -import { checkoutReducer } from './checkout/reducers/checkout.reducer'; -import { authReducer } from './auth/reducers/auth.reducer'; +import * as fromUser from './user/reducers/user.reducer'; +import * as fromCheckout from './checkout/reducers/checkout.reducer'; +import * as fromAuth from './auth/reducers/auth.reducer'; /** * combineReducers is another useful metareducer that takes a map of reducer @@ -14,9 +13,9 @@ import { authReducer } from './auth/reducers/auth.reducer'; * * More: https://egghead.io/lessons/javascript-redux-implementing-combinereducers-from-scratch */ -import { combineReducers, ActionReducer } from '@ngrx/store'; +import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store'; -import { AppState } from './interfaces'; +import { AppState as State } from './interfaces'; /** * The compose function is one of our most handy tools. In basic terms, you give @@ -35,30 +34,28 @@ import { compose } from '@ngrx/core/compose'; */ import { storeFreeze } from 'ngrx-store-freeze'; -const reducers = { - products: productReducer, - auth: authReducer, - checkout: checkoutReducer, - users: userReducer, - search: searchReducer +export const reducers: ActionReducerMap = { + products: fromProduct.reducer, + auth: fromAuth.reducer, + checkout: fromCheckout.reducer, + users: fromUser.reducer }; -export const developmentReducer: ActionReducer = compose(storeFreeze, combineReducers)(reducers); ; -const productionReducer: ActionReducer = combineReducers(reducers); +// console.log all actions +export function logger(reducer: ActionReducer): ActionReducer { + return function(state: State, action: any): State { + console.log('state', state); + console.log('action', action); -/** - * - * - * @export - * @param {*} state - * @param {*} action - * @returns - */ -export function reducer(state: any, action: any) { - if (environment.production) { - return productionReducer(state, action); - } else { - return developmentReducer(state, action); - } + return reducer(state, action); + }; } +/** + * By default, @ngrx/store uses combineReducers with the reducer map to compose + * the root meta-reducer. To add more meta-reducers, provide an array of meta-reducers + * that will be composed to form the root meta-reducer. + */ +export const metaReducers: MetaReducer[] = !environment.production + ? [logger] + : []; diff --git a/src/app/auth/actions/auth.actions.ts b/src/app/auth/actions/auth.actions.ts index cee7061a..3992b19e 100644 --- a/src/app/auth/actions/auth.actions.ts +++ b/src/app/auth/actions/auth.actions.ts @@ -7,23 +7,23 @@ export class AuthActions { static LOGOUT_SUCCESS = 'LOGOUT_SUCCESS'; static AUTHORIZE = 'AUTHORIZE'; - authorize(): Action { + authorize() { return { type: AuthActions.AUTHORIZE }; } - login(): Action { + login() { return { type: AuthActions.LOGIN }; } - loginSuccess(): Action { + loginSuccess() { return { type: AuthActions.LOGIN_SUCCESS}; } - logout(): Action { + logout() { return { type: AuthActions.LOGOUT }; } - logoutSuccess(): Action { + logoutSuccess() { return { type: AuthActions.LOGOUT_SUCCESS }; } } diff --git a/src/app/auth/reducers/auth.reducer.ts b/src/app/auth/reducers/auth.reducer.ts index 9ae718a8..61dcbd7f 100644 --- a/src/app/auth/reducers/auth.reducer.ts +++ b/src/app/auth/reducers/auth.reducer.ts @@ -4,8 +4,7 @@ import { AuthState, AuthStateRecord } from './auth.state'; export const initialState: AuthState = new AuthStateRecord() as AuthState; -export const authReducer: ActionReducer = - (state: AuthState = initialState, { type, payload }: Action): AuthState => { +export function reducer(state = initialState, { type, payload }: any): AuthState { switch (type) { case AuthActions.LOGIN_SUCCESS: return state.merge({ isAuthenticated: true }) as AuthState; diff --git a/src/app/checkout/actions/checkout.actions.ts b/src/app/checkout/actions/checkout.actions.ts index 1219629d..51cdefd3 100644 --- a/src/app/checkout/actions/checkout.actions.ts +++ b/src/app/checkout/actions/checkout.actions.ts @@ -28,61 +28,61 @@ export class CheckoutActions { }; } - addToCart(variant_id: number): Action { + addToCart(variant_id: number) { return { type: CheckoutActions.ADD_TO_CART, payload: variant_id }; } - addToCartSuccess(lineItem: LineItem): Action { + addToCartSuccess(lineItem: LineItem) { return { type: CheckoutActions.ADD_TO_CART_SUCCESS, payload: lineItem }; } - removeLineItem(lineItemId: number): Action { + removeLineItem(lineItemId: number) { return { type: CheckoutActions.REMOVE_LINE_ITEM, payload: lineItemId }; } - removeLineItemSuccess(lineItem: LineItem): Action { + removeLineItemSuccess(lineItem: LineItem) { return { type: CheckoutActions.REMOVE_LINE_ITEM_SUCCESS, payload: lineItem }; } - changeLineItemQuantity(quantity: number, lineItemId: number): Action { + changeLineItemQuantity(quantity: number, lineItemId: number) { return { type: CheckoutActions.CHANGE_LINE_ITEM_QUANTITY, payload: { quantity, lineItemId } }; } - placeOrder(): Action { + placeOrder() { return { type: CheckoutActions.PLACE_ORDER }; } - changeOrderState(): Action { + changeOrderState() { return { type: CheckoutActions.CHANGE_ORDER_STATE }; } - changeOrderStateSuccess(order: Order): Action { + changeOrderStateSuccess(order: Order) { return { type: CheckoutActions.CHANGE_ORDER_STATE_SUCCESS, payload: order }; } - updateOrder(): Action { + updateOrder() { return { type: CheckoutActions.UPDATE_ORDER }; } - updateOrderSuccess(order: Order): Action { + updateOrderSuccess(order: Order) { return { type: CheckoutActions.UPDATE_ORDER_SUCCESS, payload: order diff --git a/src/app/checkout/checkout.module.ts b/src/app/checkout/checkout.module.ts index 58abb766..9a5d3c19 100644 --- a/src/app/checkout/checkout.module.ts +++ b/src/app/checkout/checkout.module.ts @@ -16,7 +16,9 @@ import { CheckoutRoutes as routes } from './checkout.routes'; imports: [ CommonModule, RouterModule.forChild(routes), - EffectsModule.run(CheckoutEffects), + EffectsModule.forRoot([ + CheckoutEffects + ]), CartModule, AddressModule, PaymentModule diff --git a/src/app/checkout/effects/checkout.effects.ts b/src/app/checkout/effects/checkout.effects.ts index b591063c..704c6a1c 100644 --- a/src/app/checkout/effects/checkout.effects.ts +++ b/src/app/checkout/effects/checkout.effects.ts @@ -17,7 +17,7 @@ export class CheckoutEffects { @Effect() AddToCart$ = this.actions$ .ofType(CheckoutActions.ADD_TO_CART) - .switchMap((action: Action) => { + .switchMap((action: any) => { return this.checkoutService.createNewLineItem(action.payload); }) .map((lineItem: LineItem) => this.actions.addToCartSuccess(lineItem)); @@ -25,7 +25,7 @@ export class CheckoutEffects { // @Effect() // FetchCurrentOrder$ = this.actions$ // .ofType(CartActions.FETCH_CURRENT_ORDER) - // .switchMap((action: Action) => { + // .switchMap((action: any) => { // return this.cartService.fetchCurrentOrder(); // }) // .map((order: Order) => { @@ -39,7 +39,7 @@ export class CheckoutEffects { // @Effect() // RemoveLineItem$ = this.actions$ // .ofType(CartActions.REMOVE_LINE_ITEM) - // .switchMap((action: Action) => { + // .switchMap((action: any) => { // return this.cartService.deleteLineItem(action.payload); // }) // .map(() => this.cartActions.removeLineItemSuccess()); diff --git a/src/app/checkout/reducers/checkout.reducer.ts b/src/app/checkout/reducers/checkout.reducer.ts index 2f57f6ac..910bfe29 100644 --- a/src/app/checkout/reducers/checkout.reducer.ts +++ b/src/app/checkout/reducers/checkout.reducer.ts @@ -6,8 +6,7 @@ import { Action, ActionReducer } from '@ngrx/store'; export const initialState: CheckoutState = new CheckoutStateRecord() as CheckoutState; -export const checkoutReducer: ActionReducer = - (state: CheckoutState = initialState, { type, payload }: Action): CheckoutState => { +export function reducer(state = initialState, { type, payload }: any): CheckoutState { let _lineItems, _lineItemEntities, _lineItemIds, _lineItem, _lineItemEntity, _lineItemId, diff --git a/src/app/core/index.ts b/src/app/core/index.ts index b5de053c..69e7133c 100644 --- a/src/app/core/index.ts +++ b/src/app/core/index.ts @@ -43,10 +43,12 @@ export function httpInterceptor( imports: [ // Were not working on modules sice update to rc-5 // TO BE moved to respective modules. - EffectsModule.run(AuthenticationEffects), - EffectsModule.run(ProductEffects), - EffectsModule.run(CheckoutEffects), - EffectsModule.run(UserEffects) + EffectsModule.forRoot([ + AuthenticationEffects, + ProductEffects, + CheckoutEffects, + UserEffects + ]) ], providers: [ VariantParserService, diff --git a/src/app/home/content/product-list/product-list.component.html b/src/app/home/content/product-list/product-list.component.html index 876cd7cc..a8ddd22b 100644 --- a/src/app/home/content/product-list/product-list.component.html +++ b/src/app/home/content/product-list/product-list.component.html @@ -2,7 +2,7 @@