replaced path+route_load navigation by id nav for articles and thematiques

web/modules/custom/materio_graphql/src/Plugin/GraphQL/SchemaExtension/MaterioSchemaExtension.php

@@ -99,6 +99,10 @@ class MaterioSchemaExtension extends SdlSchemaExtensionPluginBase {
 
     $registry->addFieldResolver('Query', 'route',
       $builder->compose(
+        $builder->callBack(function($parent, $args){
+          $t="t";
+          return $parent;
+        }),
         $builder->produce('route_load')
           ->map('path', $builder->fromArgument('path')),
         $builder->callBack(function($parent, $args){
@@ -548,12 +552,12 @@ class MaterioSchemaExtension extends SdlSchemaExtensionPluginBase {
   //                                    |_|
   protected function addThematique(ResolverRegistryInterface $registry, ResolverBuilder $builder) {
 
-    $registry->addFieldResolver('Query', 'Thematique',
+    $registry->addFieldResolver('Query', 'thematique',
       $builder->produce('entity_load')
         ->map('type', $builder->fromValue('node'))
-        ->map('bundles', $builder->fromValue(['thematique']))
+        // ->map('bundles', $builder->fromValue(['thematique']))
         ->map('id', $builder->fromArgument('id'))
-      );
+    );
 
     $registry->addFieldResolver('Thematique', 'id',
       $builder->produce('entity_id')

web/themes/custom/materiotheme/vuejs/api/gql/thematique.fragment.gql

@@ -20,8 +20,6 @@ fragment ThematiqueFields on Thematique {
     id
     url
     alt
-    style_cardmedium{
-      url
-    }
+    style_cardfull_url
   }
 }

web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue

@@ -37,7 +37,7 @@ export default {
       console.log('clicked on article', this.alias);
       this.$router.push({
         name:`article`,
-        params: { alias:this.alias }
+        params: { alias:this.alias, id: this.item.nid }
         // query: { nid: this.item.nid }
         // meta: { uuid:this.item.uuid },
       })

web/themes/custom/materiotheme/vuejs/components/Content/CardThematique.vue

@@ -101,9 +101,9 @@ export default {
       console.log('openThematique', e, this.alias);
       this.$router.push({
         name:`thematique`,
-        params: { alias:this.alias }
-        // query: { nid: this.item.nid }
-        // meta: { uuid:this.item.uuid },
+        params: { alias:this.alias, id: this.item.id }
+        // query: { id: this.item.id },
+        // meta: { id:this.item.id }
       })
     }
   }

web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue

@@ -169,33 +169,23 @@ export default {
       getPrevNextItems: 'Blabla/getPrevNextItems'
     }),
     getArticle(){
-      console.log(this.$route);
-      // get the article uuid
-      // if(this.$route.query.nid){
-      //   // we come from internal link with vuejs
-      //   // directly record uuid
-      //   this.nid = this.$route.query.nid
-      //
-      // }else if(drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'article'){
-      //   // we landed in an internal page
-      //   // get the uuid from drupalDeclouped, provided by materio_decoupled.module
-      //   this.nid = drupalDecoupled.entity_id
-      // }
-
-      if (this.$route.path) {
+      console.log('getArticle', this.$route);
+      if (this.$route.params.id) {
         // we come from internal link with vuejs
-        this.path = this.$route.path
-      } else {
+        // using path to load from route is hasardous
+        // this.path = this.$route.path
+        this.id = this.$route.params.id
+      }else if(drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'article'){
         // we landed in an internal page
-        this.path = window.location.pathname
+        // get the id from drupalDeclouped, provided by materio_decoupled.module
+        this.id = drupalDecoupled.entity_id
       }
 
-      if(this.path){
+      if(this.id){
         this.loadArticle()
       }else{
-        // if for any reason we dont have the uuid
-        // redirect to home
-        this.$route.replace('home')
+        // if for any reason we dont have the id redirect to home
+        this.$router.replace({name:'home'})
       }
     },
     getIndex(){
@@ -213,7 +203,7 @@ export default {
       this.loading = true
 
       let ast = gql`{
-        route(path: "${this.path}", lang: "${drupalDecoupled.lang_code}") {
+        article(id: ${this.id}, lang: "${drupalDecoupled.lang_code}") {
           ...ArticleFields
         }
       }
@@ -221,9 +211,9 @@ export default {
       `
       MGQ.post('', { query: print(ast)
       })
-        .then(({ data:{data:{route}}}) => {
-          console.log('loadArticle', route )
-          this.parseDataGQL(route)
+        .then(({ data:{data:{article}}}) => {
+          console.log('loadArticle', article )
+          this.parseDataGQL(article)
         })
         .catch(error => {
           console.warn('Issue with loadArticle', error)

web/themes/custom/materiotheme/vuejs/components/Pages/Thematique.vue

@@ -7,7 +7,7 @@
       <div class="col col-left">
         <section class="body" v-html="thematique.body"></section>
         <section class="visuel">
-          <img :src="image_accroche.style_cardmedium.url" alt="">
+          <img :src="image_accroche.style_cardfull_url" alt="">
         </section>
       </div> <!-- //col-left -->
       <div class="col col-right">
@@ -76,50 +76,41 @@ export default {
     // }),
     getThematique(){
       console.log('getThematique', this.$route);
-      // get the article uuid
-      // if(this.$route.query.nid){
-      //   // we come from internal link with vuejs
-      //   // directly record uuid
-      //   this.nid = this.$route.query.nid
-      //
-      // }else if(drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'article'){
-      //   // we landed in an internal page
-      //   // get the uuid from drupalDeclouped, provided by materio_decoupled.module
-      //   this.nid = drupalDecoupled.entity_id
-      // }
-
-      if (this.$route.path) {
+      if (this.$route.params.id) {
         // we come from internal link with vuejs
-        this.path = this.$route.path
-      } else {
+        // using path to load from route is hasardous
+        // this.path = this.$route.path
+        this.id = this.$route.params.id
+      }else if(drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'thematique'){
         // we landed in an internal page
-        this.path = window.location.pathname
+        // get the id from drupalDeclouped, provided by materio_decoupled.module
+        this.id = drupalDecoupled.entity_id
       }
 
-      if(this.path){
+      if(this.id){
         this.loadThematique()
       }else{
-        // if for any reason we dont have the uuid
-        // redirect to home
-        this.$route.replace('home')
+        // if for any reason we dont have the id redirect to home
+        this.$router.replace({name:'home'})
       }
     },
     loadThematique(){
       console.log('loadThematique')
       this.loading = true
-
+      //
       let ast = gql`{
-        route(path: "${this.path}", lang: "${drupalDecoupled.lang_code}") {
+        thematique(id: ${this.id}, lang: "${drupalDecoupled.lang_code}") {
           ...ThematiqueFields
         }
       }
       ${ thematiqueFields }
       `
+      // ?XDEBUG_SESSION_START=1
       MGQ.post('', { query: print(ast)
       })
-        .then(({ data:{data:{route}}}) => {
-          console.log('loaded Thematique', route)
-          this.parseDataGQL(route)
+        .then(({ data:{data:{thematique}}}) => {
+          console.log('loaded Thematique', thematique)
+          this.parseDataGQL(thematique)
         })
         .catch(error => {
           console.warn('Issue with loadThematique', error)