remove grid logic from post component

webapp/components/PostCard/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <ds-grid-item ref="postCard" :rowSpan="rowSpan">
   <ds-card
     :image="post.image | proxyApiUrl"
     :class="{ 'post-card': true, 'disabled-content': post.disabled }"
@@ -67,7 +66,6 @@
       </no-ssr>
     </template>
   </ds-card>
-  </ds-grid-item>
 </template>
 
 <script>
@@ -97,11 +95,6 @@ export default {
       default: () => {},
     },
   },
-  data() {
-    return {
-      rowSpan: 10,
-    }
-  },
   computed: {
     ...mapGetters({
       user: 'auth/user',
@@ -132,26 +125,6 @@ export default {
         this.$toast.error(err.message)
       }
     },
-    calculateItemHeight() {
-      const grid = document.querySelector('.ds-grid')
-      const rowHeight = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-auto-rows'))
-      const rowGap = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-row-gap'))
-      grid.style.gridAutoRows = 'auto'
-      grid.style.alignItems = 'self-start'
-      const itemHeight = this.$refs.postCard.$el.clientHeight
-      this.rowSpan = Math.ceil((itemHeight + rowGap) / (rowHeight + rowGap))
-      grid.style.gridAutoRows = `${rowHeight}px`
-      grid.style.alignItems = 'stretch'
-    },
-  },
-  mounted() {
-    const image = this.$refs.postCard.$el.querySelector('img')
-    if (image) {
-      image.onload = this.calculateItemHeight
-    } else {
-      // use timeout to make sure layout is set up before executing
-      setTimeout(this.calculateItemHeight, 0)
-    }
   },
 }
 </script>