Feature/cms content #2001

yuriboyko · 2018-11-16T17:04:14Z

Related issues

#1987
#1894

Short description and why it's useful

This PR adds functionality for using CMS content from Elasticsearch with supporting SSR
It uses dynamic routes for CMS pages

For CMS block usage example please check demo page Vue file
src/themes/default/pages/CmsBlockDemoPageSsr.vue

Data structure

For CMS pages uses elasticsearch index entity type 'cms_page':

`id`
`title`
`meta_keywords`
`meta_description`
`identifier`
`content_heading`
`content`
`creation_time`
`update_time`
`active`

For CMS blocks uses elasticsearch index entity type 'cms_block':

`id`
`title`
`identifier`
`content`
`creation_time`
`update_time`

Announcement

Later will be provided functionality for page hierarchy

Magento support

Data migration tools for Magento 1 and Magento 2 will be updated accordingly very soon with correspond PRs

# Conflicts: # core/store/lib/search/adapter/graphql/processor/processType.ts # core/store/lib/search/adapter/graphql/searchAdapter.ts # core/store/modules/index.ts

# Conflicts: # src/themes/default/router/index.js

…s , fix bugs # Conflicts: # core/store/mutation-types.ts # src/themes/default/router/index.js

…ssues # Conflicts: # core/store/mutation-types.ts # src/themes/default/router/index.js

filrak

Awesome to finally have this, thank you! I added my comments mostly regarding encapsulating cms logic inside module instead of splitting it across whole app. Please adjust the PR

core/components/blocks/Cms/Block.js

core/modules/cms/store/block/actions.ts

core/modules/cms/store/block/mutations.ts

core/pages/CmsPage.js

core/store/index.ts

filrak · 2018-11-18T10:11:17Z

core/store/lib/search/adapter/graphql/queries/cmsBlock.gql

@@ -0,0 +1,13 @@
+query cmsBlocks ($filter: CmsInput) {


should be in module/queries

This gql is related to the ceratin searchAdapter. Not sure if it should be in the module/queries

I agree with @filrak; if there is currently no way to fully add query/resultAdapter from the module level - then we need to extend the graphQL API to have this capability. Anyway - everything should be registered from the module level not modifying the core; CMS module should be a example how decoupled the app is with new module system

ok i see the idea. then probably it makes sense
i will try move register entity Type to the module level

Lets move this update to another PR as it requre upadt not only cms module it should be applied for all other modules uses queries as well

Please add an issue for this

filrak · 2018-11-18T10:11:27Z

core/store/lib/search/adapter/graphql/queries/cmsHierarchy.gql

@@ -0,0 +1,14 @@
+query cmsHierarchies ($filter: CmsInput) {


should be in module/queries

This gql is related to the certain searchAdapter. Not sure if it should be in the module/queries

Same as above - it should be within the module only. We need to have a capability of extending graphQL entities for custom ones from the module level

same as above - Lets move this update to another PR as it requre upadt not only cms module it should be applied for all other modules uses queries as well

filrak · 2018-11-18T10:11:44Z

core/store/lib/search/adapter/graphql/queries/cmsPage.gql

@@ -0,0 +1,14 @@
+query cmsPages ($filter: CmsInput) {


should be in module/queries

This gql is related to the certain searchAdapter. Not sure if it should be in the module/queries

Same as above

same as above - Lets move this update to another PR as it requre upadt not only cms module it should be applied for all other modules uses queries as well

filrak · 2018-11-18T10:12:12Z

core/store/mutation-types.ts

should be in module

this is not our code part. also as i see SYNC_PROCESS_QUEUE mutation type is not used at all. maybe you can simply remove it

i meant all the rest, sorry for misleading. currently only /sync tasks should be left in vuex module

pkarw · 2018-11-19T20:30:08Z

config/default.json

+    },
+    "cms_page": {
+      "max_count": 500
+    },


We shouldn’t load all cms blocks and pages as it will cause sending them with the INITIAL_STATE output and can be harmful boot h for performance + SEO

this config option will need to easily manage load of all blocks list if it needs as we need to have size provided for ES to get the data overwise it will be only 10

pkarw · 2018-11-19T20:32:29Z

core/store/lib/search/adapter/api/searchAdapter.ts

+      resultPorcessor: (resp, start, size) =>  {
+        return this.handleResult(resp, 'cms_hierarchy', start, size)
+      }
+    })


These entities should be registered from the module level - keeping all the CMS oriented logic inside the cms module - not in the core I believe (currently CMS is also a module without references from the core)

same as for gql comments - Lets move this update to another PR

Could you create an issue for that?

Issue is created

pkarw · 2018-11-19T20:36:41Z

src/themes/default/components/core/blocks/Cms/Block.vue

+    }
+  },
+  asyncData ({ store, route, context }) {
+    // @TODO to cover SSR need find a way to pass props identifier/id to the asyncData()


asyncData() won’t be called for child components; so if You place 3 different CmsBlocks on one single page - asyncData won’t be called for these CmsBlocks. Therefore we need this dataLoader pattern implemented - and then we can call store.dispatch(‘dm/registerPromise’, this.loadData()) in created() event handler as we discussed with @yuriboyko on Slack

As i see asyncData() is called for child components in our case but the main problem is what we are not able to use component props to fetch correspond block data by identifier. Suggested solution by @pkarw is stll in the progress. For now I suggest this using SSR for CMS blocks it as a stuff for next pull request

As i mentioned. For now CMS blocks recoded to not use SSR as solution initially suggested does not work and the way with loading all blocks also is not good. Need find a new solution and it will be a new PR.

pkarw

We need to move the graphQL objects registration to the module level, add on-demand data loading (via dataLoader - data loading promises to be registered inside created() event in components), we also need to load the blocks and pages on demand - not as they’re loaded all at once currently

pkarw · 2018-11-20T20:26:43Z

@yuriboyko how do You see the changes required in here? When can we expect them to happen? :) I'm asking because lot of users are waiting for it - and we're releaseing 1.6 on 6th of December :) So the next week is great chance to make it happen to have another week for tests :D

yuriboyko · 2018-11-21T08:42:29Z

@pkarw I hope to finish all changes today

pkarw · 2018-11-21T09:00:28Z

@yuriboyko - perfect! Thanks

…oading for cms pages , update by PR change requirements

This reverts commit c38a130.

This reverts commit e5d2c1c.

filrak · 2018-11-26T09:30:03Z

@yuriboyko can you please let us know when its ready ?

yuriboyko · 2018-11-26T15:50:19Z

@filrak
At this moment all possible changes are done and commited.
As i mentioned before regarding moving queries to module level it will be separate PR
Regarding using SSR for blocks and do not using preload i already talked to Piotr
and i think for now would be better to not use SSR for blocks, as to use it we need to preload all blocks to solve issues with not accessible props, but unfortunately it is also not possible to read cachestorage on the asyncData level. This means even if we would use SSR with load all blocks and saving them to cachestorage next time with page load there will be not way to verify if blocks are loaded to cachestorage (as cachestoarge not acessible) so blocks loads will happen again which is not good. So for now i suggest to not change anything and then if we find some other solution for blocks SSR it will be another PR.

So for now i think current state is ready for approve PR to have this CMS functionality. if you see some other issues let me know

# Conflicts: # src/themes/default/router/index.js

filrak · 2018-11-28T11:47:00Z

@pkarw if everything is fine from your side can you approve ?

pkarw · 2018-11-27T08:07:17Z

core/pages/CmsPage.js

+        value: route.params.slug
+      }).then(res => {
+        if (res) {
+          store.state.cmsPage.current = res


This should be moved to mutation called from the cmsPage/single action, not in here @yuriboyko

pkarw · 2018-11-27T08:08:25Z

core/pages/CmsPage.js

+  },
+  methods: {
+    savePage (page) {
+      return this.$store.state['cmsPage'] && Object.keys(page).length > 0 ? this.$store.dispatch('cmsPage/addItem', page) : false


Should be moved to vuex

pkarw · 2018-11-27T08:09:17Z

core/store/lib/search/adapter/graphql/queries/cmsBlock.gql

@@ -0,0 +1,13 @@
+query cmsBlocks ($filter: CmsInput) {


Please add an issue for this

pkarw · 2018-11-27T08:10:13Z

src/themes/default/components/core/blocks/Cms/Block.vue

+    })
+  }) */
+  // },
+  created () {


Please add an issue for SSR support for CMS blocks @yuriboyko please

# Conflicts: # core/store/mutation-types.ts

VladimirPlastovets and others added 7 commits November 16, 2018 17:23

added actions/queries/processors for cms entities to graphql adapter

efef370

# Conflicts: # core/store/lib/search/adapter/graphql/processor/processType.ts # core/store/lib/search/adapter/graphql/searchAdapter.ts # core/store/modules/index.ts

praparing router and component for cms pages

e6d263e

# Conflicts: # src/themes/default/router/index.js

update routing system, prepare template, update actions, add mutation…

dbfc169

…s , fix bugs # Conflicts: # core/store/mutation-types.ts # src/themes/default/router/index.js

CMS-blocks feature with SSR, fix bugs improve logic, fix 404 handle i…

41ecff4

…ssues # Conflicts: # core/store/mutation-types.ts # src/themes/default/router/index.js

clean up

035acd8

Clean up CMS content functionality code

79831d4

update CMS module with new module structures

6bf70d5

yuriboyko mentioned this pull request Nov 16, 2018

added graphql shecma/resolver for cms entities vuestorefront/vue-storefront-api#140

Merged

Merge branch 'develop' into feature/cms-content

d7599ae

filrak requested changes Nov 18, 2018

View reviewed changes

filrak changed the title ~~Feature/cms content~~ WIP: Feature/cms content Nov 18, 2018

yuriboyko added 2 commits November 19, 2018 17:06

remove old coded compoment .js

95ae1ce

Remove using deprecated EventBus

694ebf3

pkarw reviewed Nov 19, 2018

View reviewed changes

pkarw requested changes Nov 19, 2018

View reviewed changes

yuriboyko and others added 7 commits November 22, 2018 17:32

update CMS module with new structure add using cacheStorage, update l…

35db452

…oading for cms pages , update by PR change requirements

CMS block action clean up

41a319a

Add Data Manager module

e5d2c1c

Add test code for using datamanager to apply SSR for CMS blocks

c38a130

Revert "Add test code for using datamanager to apply SSR for CMS blocks"

d033a75

This reverts commit c38a130.

Revert "Add Data Manager module"

d575879

This reverts commit e5d2c1c.

Merge branch 'develop' into feature/cms-content

ae34cc1

Merge remote-tracking branch 'upstream/develop' into feature/cms-content

752b301

# Conflicts: # src/themes/default/router/index.js

Merge remote-tracking branch 'upstream/develop' into feature/cms-content

1f0ec0e

# Conflicts: # src/themes/default/router/index.js

filrak approved these changes Nov 28, 2018

View reviewed changes

filrak changed the title ~~WIP: Feature/cms content~~ Feature/cms content Nov 28, 2018

yuriboyko added 3 commits November 28, 2018 15:02

Merge remote-tracking branch 'upstream/develop' into feature/cms-content

47b45cd

update import of initCacheStorage and VueStorefrontModule

34c108e

Merge remote-tracking branch 'upstream/develop' into feature/cms-content

ca8fc0e

pkarw approved these changes Nov 29, 2018

View reviewed changes

Merge remote-tracking branch 'upstream/develop' into feature/cms-content

ed3c7e2

# Conflicts: # core/store/mutation-types.ts

pkarw merged commit 299182e into vuestorefront:develop Nov 29, 2018

Feature/cms content #2001

Feature/cms content #2001

Conversation

yuriboyko commented Nov 16, 2018 • edited Loading

Related issues

Short description and why it's useful

Data structure

Announcement

Magento support

filrak left a comment • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pkarw left a comment

Choose a reason for hiding this comment

pkarw commented Nov 20, 2018

yuriboyko commented Nov 21, 2018

pkarw commented Nov 21, 2018

filrak commented Nov 26, 2018

yuriboyko commented Nov 26, 2018

filrak commented Nov 28, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yuriboyko commented Nov 16, 2018 •

edited

Loading

filrak left a comment •

edited

Loading