createCopyUrl to _category.vue

components/Card.vue

@@ -3,31 +3,14 @@
     p.card--title {{resource.title}}
     p.card--description {{resource.desc}}
     .card--links
-      a.card--reference(@click='createCopyUrl') Copy
+      a.card--reference(@click='createCopyUrl(resource)') Copy
       br
       a.card--target(:href="resource.url" :target='resource.title' rel='noreferrer') Open
 </template>
 
 <script>
 export default {
-  props: ['resource', 'isActive'],
+  props: ['resource', 'isActive', 'createCopyUrl'],
-  data(){
-    return {}
-  },
-  methods: {
-     async createCopyUrl() {
-      try {
-        const { path } = this.resource
-        await this.$copyText(`https://webgems.io${path}`)
-        this.$emit('toggle', 'test')
-        this.$router.push(path)
-      } catch (e) {
-        console.error(e);
-      }
-    },
-  },
-  mounted() {},
-  watch: {},
 }
 </script>
 

components/TableRow.vue

@@ -5,31 +5,14 @@
     td.tableRow--links
       tr
         td
-          a.tableRow--reference(@click='createCopyUrl') Copy
+          a.tableRow--reference(@click='createCopyUrl(resource)') Copy
         td
           a.tableRow--target(:href="resource.url" :target='resource.title' rel='noreferrer') Open
 </template>
 
 <script>
 export default {
-  props: ['resource', 'isActive'],
+  props: ['resource', 'isActive', 'createCopyUrl'],
-  data() {
-    return {};
-  },
-  methods: {
-     async createCopyUrl() {
-      try {
-        const { path } = this.resource
-        await this.$copyText(`https://webgems.io${path}`)
-        this.$emit('toggle', 'test')
-        this.$router.push(path)
-      } catch (e) {
-        console.error(e);
-      }
-    },
-  },
-  mounted() {},
-  watch: {},
 };
 </script>
 

pages/_category.vue

@@ -4,12 +4,12 @@
     .cards(v-if="cardsShown")
       template
         div(v-for='resource in category.resources' :key='resource.title')
-          Card(:resource='resource' :isActive='activeCard === resource.title' v-on:toggle='onToggle(resource.title)')
+          Card(:resource='resource' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.title')
     table(v-if="!cardsShown")
       TableHead(:title="'Welcome'" :desc="'Description'" :url="'URL'")
       template
         div(v-for='resource in category.resources' :key='resource.title')
-          TableRow(:resource='resource' :isActive='activeCard === resource.title' v-on:toggle='onToggle(resource.title)')
+          TableRow(:resource='resource' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.title')
 </template>
 
 <script>
@@ -53,6 +53,16 @@ export default {
       } else {
         this.activeCard = index;
       }
+    },
+    async createCopyUrl(resource) {      
+      try {
+        const { path } = resource
+        await this.$copyText(`https://webgems.io${path}`)
+        this.onToggle(resource.title)
+        this.$router.push(path)
+      } catch (e) {
+        console.error(e);
+      }
     }
   },
   components: { Card, TableHead, TableRow }