Remove cache from product detail

Author: webdevstar

src/store/server/ajax.js

@@ -4,9 +4,14 @@ import serverSettings from './settings'
 import api from 'cezerin-client';
 api.init(serverSettings.apiBaseUrl, serverSettings.security.token);
 
+const DEFAULT_CACHE_CONTROL = 'public, max-age=600';
+const PRODUCTS_CACHE_CONTROL = 'public, max-age=60';
+
 ajaxRouter.get('/products', (req, res, next) => {
-  api.products.list(req.query).then(({status, json}) => {
-    res.status(status).send(json);
+  const filter = req.query;
+  filter.enabled = true;
+  api.products.list(filter).then(({status, json}) => {
+    res.status(status).header('Cache-Control', PRODUCTS_CACHE_CONTROL).send(json);
   })
 })
 
@@ -135,25 +140,27 @@ ajaxRouter.put('/cart/billing_address', (req, res, next) => {
 
 ajaxRouter.get('/product_categories', (req, res, next) => {
   api.product_categories.list(req.query).then(({status, json}) => {
-    res.status(status).send(json);
+    res.status(status).header('Cache-Control', DEFAULT_CACHE_CONTROL).send(json);
   })
 })
 
 ajaxRouter.get('/product_categories/:id', (req, res, next) => {
   api.product_categories.retrieve(req.params.id).then(({status, json}) => {
-    res.status(status).send(json);
+    res.status(status).header('Cache-Control', DEFAULT_CACHE_CONTROL).send(json);
   })
 })
 
 ajaxRouter.get('/pages/:id', (req, res, next) => {
   api.pages.retrieve(req.params.id).then(({status, json}) => {
-    res.status(status).send(json);
+    res.status(status).header('Cache-Control', DEFAULT_CACHE_CONTROL).send(json);
   })
 })
 
 ajaxRouter.get('/sitemap', (req, res, next) => {
+  const filter = req.query;
+  filter.enabled = true;
   api.sitemap.retrieve(req.query).then(({status, json}) => {
-    res.status(status).send(json);
+    res.status(status).header('Cache-Control', DEFAULT_CACHE_CONTROL).send(json);
   })
 })
 
@@ -177,7 +184,7 @@ ajaxRouter.get('/shipping_methods', (req, res, next) => {
 
 ajaxRouter.get('/countries', (req, res, next) => {
   api.countries.list().then(({status, json}) => {
-    res.status(status).send(json);
+    res.status(status).header('Cache-Control', DEFAULT_CACHE_CONTROL).send(json);
   })
 })
 

src/store/shared/actions.js

@@ -82,7 +82,6 @@ export function setCategory(category_id) {
     const state = getState();
     const category = state.app.categories.find(c => c.id === category_id);
     dispatch(setCurrentCategory(category));
-    dispatch(fetchProducts());
     dispatch(receiveProduct(null))
   }
 }
@@ -290,7 +289,7 @@ export function fetchProducts() {
 export function fetchMoreProducts() {
   return (dispatch, getState) => {
     const state = getState();
-    if(state.app.loadingProducts) {
+    if(state.app.loadingProducts || state.app.products.length === 0) {
       return Promise.resolve();
     }
     dispatch(requestMoreProducts());
@@ -382,7 +381,6 @@ export const getInitialState = (req, checkout_fields, currentPage, settings) =>
       order: null,
       productsFilter: {
         limit: 30,
-        enabled: true,
         fields: 'path,id,name,category_id,category_name,sku,images,enabled,discontinued,stock_status,stock_quantity,price,on_sale,regular_price'
       },
       checkout_fields: checkout_fields

src/store/shared/routes.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import {Route, IndexRoute} from 'react-router'
 import clientSettings from '../client/settings'
-import {fetchProduct, fetchPage, setCategory, receiveSitemap} from './actions'
+import {fetchProduct, fetchProducts, fetchPage, setCategory, receiveSitemap} from './actions'
 
 import api from 'cezerin-client';
 api.initAjax(clientSettings.ajaxBaseUrl);
@@ -15,22 +15,44 @@ import CheckoutContainer from './containers/checkout'
 import CheckoutSuccessContainer from './containers/checkoutSuccess'
 import NotFoundContainer from './containers/notfound'
 
-function checkSitemap(nextState, cb) {
+const getSitemap = (path, state, dispatch) => {
+  const currentPageFromState = state.app.currentPage;
+  // loaded on first request (server side)
+  const currentPageAlreadyInState = currentPageFromState && currentPageFromState.path === path;
+  if(currentPageAlreadyInState) {
+    return Promise.resolve({currentPage: currentPageFromState, currentPageAlreadyInState})
+  } else {
+    return api.ajax.sitemap.retrieve({ path: path }).then(sitemapResponse => {
+      const currentPageFromRequest = sitemapResponse.json;
+      if(currentPageFromRequest) {
+        dispatch(receiveSitemap(currentPageFromRequest))
+      }
+      return ({currentPage: currentPageFromRequest, currentPageAlreadyInState});
+    })
+  }
+}
+
+function getComponent(nextState, cb) {
   const {dispatch, getState} = this.store;
   const state = getState();
 
-  api.ajax.sitemap.retrieve({ path: nextState.location.pathname, enabled: true }).then(sitemapResponse => {
-    if (sitemapResponse.json) {
-      dispatch(receiveSitemap(sitemapResponse.json))
-      if (sitemapResponse.json.type === 'product-category') {
-        dispatch(setCategory(sitemapResponse.json.resource))
+  getSitemap(nextState.location.pathname, state, dispatch).then(({currentPage, currentPageAlreadyInState}) => {
+    if (currentPage) {
+      if (currentPage.type === 'product-category') {
+        dispatch(setCategory(currentPage.resource))
+        if(!currentPageAlreadyInState){
+          dispatch(fetchProducts());
+        }
         cb(null, props => <CategoryContainer {...props}/>);
-
-      } else if (sitemapResponse.json.type === 'product') {
-        dispatch(fetchProduct(sitemapResponse.json.resource))
+      } else if (currentPage.type === 'product') {
+        if(!currentPageAlreadyInState){
+          dispatch(fetchProduct(currentPage.resource))
+        }
         cb(null, props => <ProductContainer {...props}/>);
-      } else if (sitemapResponse.json.type === 'page') {
-        dispatch(fetchPage(sitemapResponse.json.resource))
+      } else if (currentPage.type === 'page') {
+        if(!currentPageAlreadyInState){
+          dispatch(fetchPage(currentPage.resource))
+        }
         if(nextState.location.pathname == '/') {
           cb(null, IndexContainer);
         } else if(nextState.location.pathname == '/checkout') {
@@ -51,9 +73,9 @@ function checkSitemap(nextState, cb) {
 
 export default(store) => (
   <Route path='/' component={SharedContainer}>
-    <IndexRoute getComponent={checkSitemap} store={store}/>
-    <Route path="/:slug" getComponent={checkSitemap} store={store}/>
-    <Route path="/:categorySlug/:productSlug" getComponent={checkSitemap} store={store}/>
+    <IndexRoute getComponent={getComponent} store={store}/>
+    <Route path="/:slug" getComponent={getComponent} store={store}/>
+    <Route path="/:categorySlug/:productSlug" getComponent={getComponent} store={store}/>
     <Route path="*" component={NotFoundContainer} status={404}/>
   </Route>
 )

themes/current/config.json

@@ -1,4 +1,5 @@
 {
+  "language": "en",
   "list_thumbnail_width": 340,
   "preview_thumbnail_width": 100,
   "big_thumbnail_width": 800

themes/current/locales/default.json themes/current/locales/de.jsonthemes/current/locales/default.json renamed to themes/current/locales/de.json

@@ -1,5 +1,5 @@
 {
   "cartTitle": "cart",
   "cartEmpty": "Cart is empty",
-  "footerCopyright": "Copyright © 2017 Demo Drone Store. All Rights Reserved."
+  "footerCopyright": "Copyright © 2017 Demo Drone Store. All Rights Reserved. DE. "
 }

themes/current/locales/en.json

@@ -0,0 +1,5 @@
+{
+  "cartTitle": "cart",
+  "cartEmpty": "Cart is empty",
+  "footerCopyright": "Copyright © 2017 Demo Drone Store. All Rights Reserved. EN. "
+}

themes/current/src/lib/text.js

@@ -1,2 +1,2 @@
-import text from '../../locales/default.json'
-export default text
+import config from './config'
+module.exports = require('../../locales/' + config.language + '.json');