Support pinning thread messages (media)

src/components/messages/channel/MessageOperationsChannel.vue

@@ -19,6 +19,12 @@
           <v-list-item-title>{{ $t("menu.unpin") }}</v-list-item-title>
         </v-list-item-content>
       </v-list-item>
+      <v-list-item key="redact" v-if="isRedactable" @click.stop="redact">
+        <v-list-item-icon><v-icon color="#222222">delete_outline</v-icon></v-list-item-icon>
+        <v-list-item-content>
+          <v-list-item-title>{{ $t("menu.delete") }}</v-list-item-title>
+        </v-list-item-content>
+      </v-list-item>
     </v-list>
   </div>
 </template>

src/components/messages/channel/SwipeableThumbnailsView.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="swipeable-thumbnails-view">
+      <v-responsive :aspect-ratio="16 / 9" class="ma-0 pa-0">
+        <v-carousel height="100%" hide-delimiters show-arrows-on-hover v-model="currentIndex">
+          <v-carousel-item v-for="(item,index) in items" :key="item.event.getId()">
+            <ThumbnailView :item="items[index]" :previewOnly="true" />
+          </v-carousel-item>          
+        </v-carousel>
+    </v-responsive>
+    <div class="indicator-container">
+      <div v-for="(item,index) in items" :key="index" :class="{'indicator': true, 'current': index == currentIndex}" />
+    </div>
+  </div>
+</template>
+
+<script>
+import messageMixin from "../../messages/messageMixin";
+import ThumbnailView from '../../file_mode/ThumbnailView.vue';
+
+export default {
+  mixins: [messageMixin],
+  components: { ThumbnailView },
+  props: {
+    items: {
+      type: Array,
+      default: function () {
+        return []
+      }
+    },
+  },
+  data() {
+    return {
+      currentIndex: 0,
+    };
+  },
+};
+</script>
+
+<style lang="scss">
+@import "@/assets/css/chat.scss";
+</style>