Added icon to indicate sharing status of characters

app/imports/ui/components/SharedIcon.vue

@@ -0,0 +1,47 @@
+<template lang="html">
+  <v-tooltip
+    v-if="accessRights === 'reader' || accessRights === 'writer'"
+    bottom
+  >
+    <template #activator="{ on }">
+      <v-icon
+        style="opacity: 0.4"
+        v-on="on"
+      >
+        {{ accessRights === 'reader' ? 'mdi-file-eye' : 'mdi-file-edit' }}
+      </v-icon>
+    </template>
+    <span>{{ accessText }}</span>
+  </v-tooltip>
+</template>
+
+<script lang="js">
+export default {
+  props:{
+    model: {
+      type: Object,
+      required: true,
+    },
+  },
+  meteor:{
+    accessRights(){
+      let userId = Meteor.userId();
+      if (this.model.owner === userId) return 'owner'
+      else if (this.model.writers.includes(userId)) return 'writer';
+      else if (this.model.readers.includes(userId)) return 'reader';
+      else if (this.model.public) return 'public';
+      else return 'denied'
+    },
+    accessText(){
+      switch (this.accessRights){
+        case 'writer': return 'Shared with edit permission';
+        case 'reader': return 'Shared as view-only';
+        case 'public': return 'Shared as publicly viewable';
+      }
+    }
+  }
+}
+</script>
+
+<style lang="css" scoped>
+</style>

app/imports/ui/creature/character/CharacterSheetToolbar.vue

@@ -26,6 +26,7 @@
     >
       <div :key="$route.meta.title">
         <template v-if="creature">
+          <shared-icon :model="creature" />
           <v-menu
             bottom
             left
@@ -130,6 +131,7 @@ import { updateUserSharePermissions } from '/imports/api/sharing/sharing.js';
 import isDarkColor from '/imports/ui/utility/isDarkColor.js';
 import CharacterSheetFab from '/imports/ui/creature/character/CharacterSheetFab.vue';
 import getThemeColor from '/imports/ui/utility/getThemeColor.js';
+import SharedIcon from '/imports/ui/components/SharedIcon.vue';
 
 export default {
   inject: {
@@ -137,6 +139,7 @@ export default {
   },
   components: {
     CharacterSheetFab,
+    SharedIcon,
   },
   computed: {
     creatureId(){

app/imports/ui/creature/creatureList/CreatureListTile.vue

@@ -21,6 +21,9 @@
         {{ model.alignment }} {{ model.gender }} {{ model.race }}
       </v-list-item-subtitle>
     </v-list-item-content>
+    <v-list-item-action>
+      <shared-icon :model="model" />
+    </v-list-item-action>
     <v-list-item-action>
       <v-checkbox
         v-if="selection"
@@ -38,7 +41,12 @@
 </template>
 
 <script lang="js">
+import SharedIcon from '/imports/ui/components/SharedIcon.vue';
+
 export default {
+  components: {
+    SharedIcon,
+  },
   props: {
     model: {
       type: Object,