diff --git a/packages/frontend/src/cleanup/Main.vue b/packages/frontend/src/cleanup/Main.vue
index 579e73f65..1d001fc0b 100644
--- a/packages/frontend/src/cleanup/Main.vue
+++ b/packages/frontend/src/cleanup/Main.vue
@@ -7,6 +7,7 @@
       floating
       :class="`grey ${$vuetify.theme.dark ? 'darken-4' : 'lighten-4'} elevation-1`"
       :width="navWidth"
+      style="z-index: 100"
     >
       <div v-show="$route.meta.resizableNavbar" class="nav-resizer"></div>
       <main-nav :expanded="drawer" @hide-drawer="drawer = false" />
@@ -101,8 +102,7 @@ export default {
           }
         `,
         result({ data }) {
-          console.log(data)
-          if (!data) return
+          if (!data || !data.userStreamAdded) return
           if (this.$route.params.streamId === data.userStreamAdded.id) return
           this.$eventHub.$emit('notification', {
             text: `You've got a new stream!`,
diff --git a/packages/frontend/src/cleanup/components/common/SourceAppAvatar.vue b/packages/frontend/src/cleanup/components/common/SourceAppAvatar.vue
index 61ba4d5ea..bc2ea6883 100644
--- a/packages/frontend/src/cleanup/components/common/SourceAppAvatar.vue
+++ b/packages/frontend/src/cleanup/components/common/SourceAppAvatar.vue
@@ -4,7 +4,6 @@
     small
     class="ma-1 caption white--text no-hover"
     :color="color"
-    :size="size"
   >
     {{ shortName }}
   </v-chip>
@@ -12,10 +11,6 @@
 <script>
 export default {
   props: {
-    size: {
-      type: Number,
-      default: 30
-    },
     applicationName: {
       type: String,
       default: '?'
diff --git a/packages/frontend/src/cleanup/components/common/Viewer.vue b/packages/frontend/src/cleanup/components/common/Viewer.vue
index 856d5b1e2..256134450 100644
--- a/packages/frontend/src/cleanup/components/common/Viewer.vue
+++ b/packages/frontend/src/cleanup/components/common/Viewer.vue
@@ -1,6 +1,10 @@
 <template lang="html">
   <div style="height: 100%; position: relative" class="transparent">
-    <div id="rendererparent" ref="rendererparent"></div>
+    <div
+      id="rendererparent"
+      ref="rendererparent"
+      :class="`background-${$vuetify.theme.dark ? 'dark' : 'light'}`"
+    ></div>
   </div>
 </template>
 <script>
@@ -86,6 +90,19 @@ export default {
   width: 100%;
   height: 100%;
 }
+
+.background-light {
+  background: #8e9eab;
+  background: -webkit-linear-gradient(to top right, #eeeeee, #c8e8ff);
+  background: linear-gradient(to top right, #ffffff, #c8e8ff);
+}
+
+.background-dark {
+  background: #141e30;
+  background: -webkit-linear-gradient(to top, #243b55, #141e30);
+  background: linear-gradient(to top, #243b55, #141e30);
+}
+
 #renderer {
   position: absolute;
   top: 0;
diff --git a/packages/frontend/src/cleanup/components/viewer/CommitInfoResource.vue b/packages/frontend/src/cleanup/components/viewer/CommitInfoResource.vue
new file mode 100644
index 000000000..5defa237a
--- /dev/null
+++ b/packages/frontend/src/cleanup/components/viewer/CommitInfoResource.vue
@@ -0,0 +1,106 @@
+<template>
+  <div>
+    <v-card class="mx-2 mb-2 rounded-lg">
+      <v-toolbar
+        v-ripple
+        class="transparent"
+        flat
+        style="cursor: pointer"
+        @click.stop="expanded = !expanded"
+      >
+        <v-app-bar-nav-icon>
+          <user-avatar
+            :id="commit.authorId"
+            :avatar="commit.authorAvatar"
+            :name="commit.authorName"
+          />
+        </v-app-bar-nav-icon>
+        <source-app-avatar :application-name="commit.sourceApplication" />
+        <v-spacer />
+        <v-btn
+          v-if="$route.params.resourceId !== resource.id"
+          v-tooltip="'Remove'"
+          small
+          icon
+          @click.stop="$emit('remove', resource)"
+        >
+          <v-icon x-small>mdi-close</v-icon>
+        </v-btn>
+        <v-btn v-tooltip="'Toggle visibility'" small icon @click.stop="toggleVisibility()">
+          <v-icon class="grey--text" style="font-size: 12px">
+            {{ visible ? 'mdi-eye' : 'mdi-eye-off' }}
+          </v-icon>
+        </v-btn>
+        <v-btn v-tooltip="'Isolate objects'" small icon @click.stop="isolate()">
+          <v-icon x-small :class="`${isolated ? 'primary--text' : ''}`">mdi-filter</v-icon>
+        </v-btn>
+        <v-btn small icon @click.stop="expanded = !expanded">
+          <v-icon x-small>{{ expanded ? 'mdi-minus' : 'mdi-plus' }}</v-icon>
+        </v-btn>
+      </v-toolbar>
+      <v-expand-transition>
+        <div v-show="expanded" class="px-1 pb-2">
+          <div class="caption my-2 px-2">
+            {{ commit.message }}
+            <v-divider class="my-2" />
+            <timeago :datetime="commit.createdAt"></timeago>
+            ,
+            {{ new Date(commit.createdAt).toLocaleString() }}
+          </div>
+          <v-divider class="mx-2 my-2" />
+          <object-properties
+            :obj="{
+              referencedId:
+                resource.type === 'commit'
+                  ? resource.data.commit.referencedObject
+                  : resource.data.object.id
+            }"
+            :stream-id="resource.data.id"
+          />
+        </div>
+      </v-expand-transition>
+    </v-card>
+  </div>
+</template>
+<script>
+export default {
+  components: {
+    SourceAppAvatar: () => import('@/cleanup/components/common/SourceAppAvatar'),
+    UserAvatar: () => import('@/cleanup/components/common/UserAvatar'),
+    ObjectProperties: () => import('@/cleanup/components/viewer/ObjectProperties')
+  },
+  props: ['resource'],
+  data() {
+    return {
+      expanded: true
+    }
+  },
+  computed: {
+    commit() {
+      return this.resource.data.commit
+    },
+    isolated() {
+      return (
+        this.$store.state.isolateValues.indexOf(this.resource.data.commit.referencedObject) !== -1
+      )
+    },
+    visible() {
+      return this.$store.state.hideValues.indexOf(this.resource.data.commit.referencedObject) === -1
+    }
+  },
+  methods: {
+    isolate() {
+      let id = this.resource.data.commit.referencedObject
+      if (this.isolated)
+        this.$store.commit('unisolateObjects', { filterKey: '__parents', filterValues: [id] })
+      else this.$store.commit('isolateObjects', { filterKey: '__parents', filterValues: [id] })
+    },
+    toggleVisibility() {
+      let id = this.resource.data.commit.referencedObject
+      if (this.visible)
+        this.$store.commit('hideObjects', { filterKey: '__parents', filterValues: [id] })
+      else this.$store.commit('showObjects', { filterKey: '__parents', filterValues: [id] })
+    }
+  }
+}
+</script>
diff --git a/packages/frontend/src/cleanup/components/viewer/Filters.vue b/packages/frontend/src/cleanup/components/viewer/Filters.vue
index b75038aa6..48232528a 100644
--- a/packages/frontend/src/cleanup/components/viewer/Filters.vue
+++ b/packages/frontend/src/cleanup/components/viewer/Filters.vue
@@ -43,19 +43,9 @@
           <filter-category-active :filter="activeFilter" />
         </div>
         <div v-if="activeFilter && activeFilter.data.type === 'number'">
-          <filter-numeric-active :filter="activeFilter" :prevent-first-set="preventFirstSet"/>
+          <filter-numeric-active :filter="activeFilter" :prevent-first-set="preventFirstSet" />
         </div>
         <div v-show="activeFilter === null">
-          <div v-if="topFilters.length !== 0">
-            <v-subheader>Reccommended filters:</v-subheader>
-            <div v-for="(filter, index) in topFilters" :key="index">
-              <filter-row-select
-                v-if="filter"
-                :filter="filter"
-                @active-toggle="(e) => (activeFilter = e)"
-              />
-            </div>
-          </div>
           <div class="">
             <v-text-field
               v-model="filterSearch"
@@ -65,8 +55,19 @@
               append-icon="mdi-magnify"
               hide-details
               class="my-2"
-              style="position: sticky; top: 122px; z-index: 6"
+              style="position: sticky; top: 128px; z-index: 6"
             />
+            <div v-if="topFilters.length !== 0 && !filterSearch">
+              <v-subheader>Reccommended filters:</v-subheader>
+              <div v-for="(filter, index) in topFilters" :key="index">
+                <filter-row-select
+                  v-if="filter"
+                  :filter="filter"
+                  @active-toggle="(e) => (activeFilter = e)"
+                />
+              </div>
+            </div>
+            <v-subheader>{{ filterSearch ? 'Matching' : 'Other' }} filters:</v-subheader>
             <div v-for="filter in matchingFilters" :key="filter.targetKey">
               <filter-row-select :filter="filter" @active-toggle="(e) => (activeFilter = e)" />
             </div>
@@ -95,7 +96,7 @@ export default {
   },
   data() {
     return {
-      expand: true,
+      expand: false,
       revitFilters: ['type', 'family', 'level'],
       allFilters: [],
       activeFilter: null,
diff --git a/packages/frontend/src/cleanup/components/viewer/ObjectInfoResource.vue b/packages/frontend/src/cleanup/components/viewer/ObjectInfoResource.vue
new file mode 100644
index 000000000..501a6cb0f
--- /dev/null
+++ b/packages/frontend/src/cleanup/components/viewer/ObjectInfoResource.vue
@@ -0,0 +1,83 @@
+<template>
+  <div>
+    <v-card class="mx-2 mb-2 rounded-lg">
+      <v-toolbar
+        v-ripple
+        class="transparent"
+        flat
+        style="cursor: pointer"
+        @click.stop="expanded = !expanded"
+      >
+        <v-app-bar-nav-icon style="pointer-events: none">
+          <v-icon large>mdi-cube-outline</v-icon>
+        </v-app-bar-nav-icon>
+        <v-spacer />
+        <v-btn
+          v-if="$route.params.resourceId !== resource.id"
+          v-tooltip="'Remove'"
+          small
+          icon
+          @click.stop="$emit('remove', resource)"
+        >
+          <v-icon x-small>mdi-close</v-icon>
+        </v-btn>
+        <v-btn v-tooltip="'Toggle visibility'" small icon @click.stop="toggleVisibility()">
+          <v-icon class="grey--text" style="font-size: 12px">
+            {{ visible ? 'mdi-eye' : 'mdi-eye-off' }}
+          </v-icon>
+        </v-btn>
+        <v-btn v-tooltip="'Isolate objects'" small icon @click.stop="isolate()">
+          <v-icon x-small :class="`${isolated ? 'primary--text' : ''}`">mdi-filter</v-icon>
+        </v-btn>
+        <v-btn small icon @click.stop="expanded = !expanded">
+          <v-icon x-small>{{ expanded ? 'mdi-minus' : 'mdi-plus' }}</v-icon>
+        </v-btn>
+      </v-toolbar>
+      <v-expand-transition>
+        <div v-show="expanded" class="px-1">
+          <object-properties
+            :obj="{
+              referencedId: resource.data.object.id
+            }"
+            :stream-id="resource.data.id"
+          />
+        </div>
+      </v-expand-transition>
+    </v-card>
+  </div>
+</template>
+<script>
+export default {
+  components: {
+    ObjectProperties: () => import('@/cleanup/components/viewer/ObjectProperties')
+  },
+  props: ['resource'],
+  data() {
+    return {
+      expanded: true
+    }
+  },
+  computed: {
+    isolated() {
+      return this.$store.state.isolateValues.indexOf(this.resource.data.object.id) !== -1
+    },
+    visible() {
+      return this.$store.state.hideValues.indexOf(this.resource.data.object.id) === -1
+    }
+  },
+  methods: {
+    isolate() {
+      let id = this.resource.data.object.id
+      if (this.isolated)
+        this.$store.commit('unisolateObjects', { filterKey: '__parents', filterValues: [id] })
+      else this.$store.commit('isolateObjects', { filterKey: '__parents', filterValues: [id] })
+    },
+    toggleVisibility() {
+      let id = this.resource.data.object.id
+      if (this.visible)
+        this.$store.commit('hideObjects', { filterKey: '__parents', filterValues: [id] })
+      else this.$store.commit('showObjects', { filterKey: '__parents', filterValues: [id] })
+    }
+  }
+}
+</script>
diff --git a/packages/frontend/src/cleanup/components/viewer/ObjectProperties.vue b/packages/frontend/src/cleanup/components/viewer/ObjectProperties.vue
index 624401237..2bf90711f 100644
--- a/packages/frontend/src/cleanup/components/viewer/ObjectProperties.vue
+++ b/packages/frontend/src/cleanup/components/viewer/ObjectProperties.vue
@@ -15,9 +15,9 @@
           block
           plain
           :class="`grey ${$vuetify.theme.dark ? 'darken-3' : 'lighten-2'}`"
-          @click="currItems += maxItems"
+          @click.stop="currItems += maxItems"
         >
-          Load More ({{ kvps.length - currItems }})
+          Show More ({{ kvps.length - currItems }})
         </v-btn>
       </div>
     </div>
@@ -45,11 +45,11 @@ export default {
       loading: false,
       ignoredProps: [
         '__closure',
-        'displayMesh',
-        'displayValue',
+        // 'displayMesh',
+        // 'displayValue',
         '__importedUrl',
-        // '__parents', // TODO: uncomment before release
-        'totalChildrenCount'
+        '__parents'
+        // 'totalChildrenCount'
       ]
     }
   },
@@ -108,9 +108,10 @@ export default {
           !this.realObject.speckle_type?.includes('Objects')
         )
           extras.push('visibility')
-        // if (value)
+
         this.kvps.push({
-          key,
+          key: this.cleanKey(key),
+          originalKey: key,
           value,
           type,
           extras,
@@ -119,6 +120,11 @@ export default {
           refId: value?.referencedId
         })
       }
+    },
+    cleanKey(key) {
+      if (key === 'totalChildrenCount') return 'children count'
+      if (key === 'speckle_type') return 'type'
+      return key
     }
   }
 }
diff --git a/packages/frontend/src/cleanup/components/viewer/ObjectPropertiesRow.vue b/packages/frontend/src/cleanup/components/viewer/ObjectPropertiesRow.vue
index edfb2c2b2..e3f783805 100644
--- a/packages/frontend/src/cleanup/components/viewer/ObjectPropertiesRow.vue
+++ b/packages/frontend/src/cleanup/components/viewer/ObjectPropertiesRow.vue
@@ -1,20 +1,27 @@
 <template>
-  <v-row no-gutters class="my-1 property-row rounded-lg">
+  <v-row
+    no-gutters
+    :class="`my-1 py-1 property-row rounded-lg ${$vuetify.theme.dark ? 'black-bg' : 'white-bg'} ${
+      prop.type === 'object' || prop.type === 'array' ? (expanded ? 'border-blue' : 'border') : ''
+    } ${prop.type === 'object' || prop.type === 'array' ? 'hover-cursor property-row-hover' : 'normal-cursor'}`"
+    @click.stop="prop.type === 'object' || prop.type === 'array' ? (expanded = !expanded) : null"
+  >
     <v-col cols="1" class="text-center">
       <v-icon small style="font-size: 12px" :class="`${$vuetify.theme.dark ? 'grey--text' : ''}`">
         {{ icon }}
       </v-icon>
     </v-col>
     <v-col
-      v-tooltip="prop.key"
+      v-tooltip="prop.originalKey"
       cols="5"
       :class="`caption ${
         prop.type === 'object' || prop.type === 'array' ? 'hover-cursor' : ''
       } text-truncate px-1 ${$vuetify.theme.dark ? 'grey--text' : ''}`"
       style="line-height: 24px"
-      @click="prop.type === 'object' || prop.type === 'array' ? (expanded = !expanded) : null"
     >
-      {{ prop.key.startsWith('@') ? prop.key.substring(1) : prop.key }}
+      <span :class="`${expanded ? 'font-weight-bold' : ''}`">
+        {{ prop.key.startsWith('@') ? prop.key.substring(1) : prop.key }}
+      </span>
     </v-col>
     <v-col
       v-if="prop.type !== 'object' && prop.type !== 'array'"
@@ -45,9 +52,8 @@
         class="mr-1"
         target="_blank"
         :href="`/streams/${streamId}/objects/${refId}`"
-        @xxxxclick="toggleVisibility()"
       >
-        <v-icon class="grey--text" style="font-size: 11px">mdi-open-in-new</v-icon>
+        <v-icon class="grey--text" style="font-size: 12px">mdi-open-in-new</v-icon>
       </v-btn>
       <v-btn
         v-if="prop.extras.includes('visibility')"
@@ -55,9 +61,9 @@
         x-small
         icon
         class="mr-1"
-        @click="toggleVisibility()"
+        @click.stop="toggleVisibility()"
       >
-        <v-icon class="grey--text" style="font-size: 11px">
+        <v-icon class="grey--text" style="font-size: 12px">
           {{ visible ? 'mdi-eye' : 'mdi-eye-off' }}
         </v-icon>
       </v-btn>
@@ -67,15 +73,15 @@
         x-small
         icon
         class="mr-1"
-        @click="toggleFilter()"
+        @click.stop="toggleFilter()"
       >
-        <v-icon :class="`${isolated ? 'primary--text' : 'grey--text'}`" style="font-size: 11px">
+        <v-icon :class="`${isolated ? 'primary--text' : 'grey--text'}`" style="font-size: 12px">
           {{ !isolated ? 'mdi-filter' : 'mdi-filter' }}
         </v-icon>
       </v-btn>
-      <v-btn v-tooltip="'Expand/collapse property'" x-small icon @click="expanded = !expanded">
-        <v-icon :class="`${expanded ? 'primary--text' : 'grey--text'}`" style="font-size: 11px">
-          {{ expanded ? 'mdi-minus-box' : 'mdi-plus-box' }}
+      <v-btn v-tooltip="'Expand/collapse property'" x-small icon @click.stop="expanded = !expanded">
+        <v-icon :class="`${expanded ? 'grey--text' : 'primary--text'}`" style="font-size: 12px">
+          {{ expanded ? 'mdi-minus' : 'mdi-plus' }}
         </v-icon>
       </v-btn>
     </v-col>
@@ -169,11 +175,32 @@ export default {
 .hover-cursor:hover {
   cursor: pointer;
 }
+.normal-cursor:hover {
+  cursor: auto !important;
+}
+.border-blue {
+  border: solid rgba(131, 131, 131, 0.753);
+  border-width: 0px 0px 0px 2px;
+}
+.border {
+  border: solid #047ffb;
+  /* border: solid #047efb; */
+  border-width: 0px 0px 0px 2px;
+}
 .property-row {
   transition: all 0.3s ease;
-  background: rgba(120, 120, 120, 0.05);
+  padding: 0 0px 0 4px;
 }
-.property-row:hover {
-  background: rgba(120, 120, 120, 0.09);
+
+.white-bg {
+  background: white;
+}
+.black-bg {
+  background: rgb(30, 30, 30);
+}
+
+.property-row-hover:hover {
+  /* border: 1px solid rgba(120, 120, 120, 0.1); */
+  background: rgba(120, 120, 120, 0.03);
 }
 </style>
diff --git a/packages/frontend/src/cleanup/components/viewer/ObjectSelection.vue b/packages/frontend/src/cleanup/components/viewer/ObjectSelection.vue
index d5e80060a..eee767474 100644
--- a/packages/frontend/src/cleanup/components/viewer/ObjectSelection.vue
+++ b/packages/frontend/src/cleanup/components/viewer/ObjectSelection.vue
@@ -1,32 +1,25 @@
 <template>
-  <v-list dense nav class="py-0 mb-3">
-    <v-list-item
-      :class="`px-2 list-overlay-${$vuetify.theme.dark ? 'dark' : 'light'} elevation-2`"
-      style="position: sticky; top: 82px"
-      @click="expand = !expand && props.length !== 0"
-    >
-      <v-list-item-action>
-        <v-icon small :class="`${props.length !== 0 ? '' : 'grey--text'}`">mdi-mouse</v-icon>
-      </v-list-item-action>
-      <v-list-item-content>
-        <v-list-item-title>
-          Selection
-          <span class="caption grey--text">({{ objects.length }})</span>
-        </v-list-item-title>
-      </v-list-item-content>
-      <v-list-item-action class="pa-0 ma-0">
+  <div
+    class="overflow-hidden"
+    :style="`width: ${
+      $vuetify.breakpoint.xs ? '90%' : '300px'
+    }; height: 100%; position: absolute; padding-top: 72px`"
+  >
+    <!-- <v-card class="px-2"> -->
+    <perfect-scrollbar style="height: 100%" :options="{ suppressScrollX: true }">
+      <div class="d-flex align-center" style="pointer-events: auto">
+        <span class="caption">Selection Info</span>
+        <v-spacer />
         <v-btn
+          v-show="objects.length > 1"
           v-tooltip="'Open selection in a new window'"
-          :disabled="objects.length === 0 && isolated"
           small
           icon
           target="_blank"
           :href="getSelectionUrl()"
         >
-          <v-icon small>mdi-open-in-new</v-icon>
+          <v-icon x-small>mdi-open-in-new</v-icon>
         </v-btn>
-      </v-list-item-action>
-      <v-list-item-action class="pa-0 ma-0">
         <v-btn
           v-tooltip="'Isolate selected objects'"
           :disabled="objects.length === 0 && !isolated"
@@ -34,33 +27,29 @@
           icon
           @click.stop="isolateSelection()"
         >
-          <v-icon small :class="`${!isolated ? 'primary--text' : ''}`">mdi-filter</v-icon>
+          <v-icon x-small :class="`${!isolated ? 'primary--text' : ''}`">mdi-filter</v-icon>
         </v-btn>
-      </v-list-item-action>
-      <v-list-item-action class="pa-0 ma-0">
-        <v-btn small icon :disabled="props.length === 0" @click.stop="expand = !expand">
-          <v-icon>{{ expand ? 'mdi-chevron-up' : 'mdi-chevron-down' }}</v-icon>
+        <v-btn
+          v-show="$vuetify.breakpoint.xs"
+          v-tooltip="'Isolate selected objects'"
+          small
+          icon
+          @click.stop="$emit('clear-selection')"
+        >
+          <v-icon x-small>mdi-close</v-icon>
         </v-btn>
-      </v-list-item-action>
-    </v-list-item>
-    <v-expand-transition>
-      <div v-show="expand" class="mt-3">
-        <div v-for="prop in props" :key="prop.value.id">
-          <object-properties-row :prop="prop" :stream-id="streamId" :ref-id="prop.refId" />
-        </div>
-        <v-subheader v-show="props.length === 1" class="caption grey--text">
-          <v-icon
-            small
-            style="font-size: 12px"
-            :class="`${$vuetify.theme.dark ? 'grey--text' : ''} ml-0 mr-2`"
-          >
-            mdi-help
-          </v-icon>
-          Hint: hold shift to select multiple objects.
-        </v-subheader>
       </div>
-    </v-expand-transition>
-  </v-list>
+      <div v-for="prop in props" :key="prop.value.id" style="width: 99%">
+        <v-card class="transparent elevation-3 rounded-lg mb-3" style="pointer-events: auto">
+          <object-properties-row :prop="prop" :stream-id="streamId" :ref-id="prop.refId" />
+        </v-card>
+      </div>
+      <div v-show="props.length === 1 && !$vuetify.breakpoint.xs" class="caption grey--text">
+        Hint: hold shift to select multiple objects.
+      </div>
+    </perfect-scrollbar>
+    <!-- </v-card> -->
+  </div>
 </template>
 <script>
 export default {
diff --git a/packages/frontend/src/cleanup/components/viewer/Resource.vue b/packages/frontend/src/cleanup/components/viewer/Resource.vue
deleted file mode 100644
index 9e0cddafa..000000000
--- a/packages/frontend/src/cleanup/components/viewer/Resource.vue
+++ /dev/null
@@ -1,138 +0,0 @@
-<template>
-  <v-list dense nav class="mt-0 py-0 mb-3">
-    <v-list-item
-      v-if="!resource.data.error"
-      :class="`px-2 list-overlay-${$vuetify.theme.dark ? 'dark' : 'light'} elevation-0`"
-      style="position: sticky; top: 82px"
-      @click="expand = !expand"
-    >
-      <v-list-item-action>
-        <v-icon v-if="resource.type === 'commit'" small>mdi-source-commit</v-icon>
-        <v-icon v-if="resource.type === 'object'" small>mdi-cube-outline</v-icon>
-      </v-list-item-action>
-      <v-list-item-content>
-        <v-list-item-title>
-          {{ resource.type === 'commit' ? resource.data.commit.message : 'Object' }}
-        </v-list-item-title>
-      </v-list-item-content>
-      <v-list-item-action
-        v-if="isMultiple"
-        class="pa-0 ma-0"
-        @click.stop="$emit('remove', resource)"
-      >
-        <v-btn
-          v-if="$route.params.resourceId !== resource.id"
-          v-tooltip="'Remove'"
-          small
-          icon
-          @click.stop="$emit('remove', resource)"
-        >
-          <v-icon x-small>mdi-close</v-icon>
-        </v-btn>
-      </v-list-item-action>
-      <v-list-item-action v-if="isMultiple" class="pa-0 ma-0">
-        <v-btn v-tooltip="'Isolate objects'" small icon @click.stop="isolate()">
-          <v-icon x-small :class="`${isolated ? 'primary--text' : ''}`">mdi-filter</v-icon>
-        </v-btn>
-      </v-list-item-action>
-      <v-list-item-action class="pa-0 ma-0">
-        <v-btn small icon @click.stop="expand = !expand">
-          <v-icon>{{ expand ? 'mdi-chevron-up' : 'mdi-chevron-down' }}</v-icon>
-        </v-btn>
-      </v-list-item-action>
-    </v-list-item>
-    <v-list-item v-else class="warning" dark>
-      <v-list-item-action>
-        <v-icon small>mdi-alert</v-icon>
-      </v-list-item-action>
-      <v-list-item-content>
-        <v-list-item-title v-tooltip="resource.id">
-          Failed to load resource {{ resource.id }}.
-        </v-list-item-title>
-      </v-list-item-content>
-      <v-list-item-action class="pa-0 ma-0" @click.stop="$emit('remove', resource)">
-        <v-btn
-          v-if="$route.params.resourceId !== resource.id"
-          v-tooltip="'Dismiss'"
-          small
-          icon
-          @click.stop="$emit('remove', resource)"
-        >
-          <v-icon x-small>mdi-close</v-icon>
-        </v-btn>
-      </v-list-item-action>
-    </v-list-item>
-
-    <div v-if="!resource.data.error">
-      <v-expand-transition>
-        <div v-show="expand" class="mt-3">
-          <!-- <div v-if="isMultiple && resource.type === 'commit'">TODO: info</div> -->
-          <object-properties
-            :obj="{
-              referencedId:
-                resource.type === 'commit'
-                  ? resource.data.commit.referencedObject
-                  : resource.data.object.id
-            }"
-            :stream-id="resource.data.id"
-          />
-        </div>
-      </v-expand-transition>
-    </div>
-    <div v-else>
-      <v-expand-transition>
-        <v-alert v-show="expand" type="warning" dense class="text-truncate">
-          {{ resource.data.message }}
-        </v-alert>
-      </v-expand-transition>
-    </div>
-  </v-list>
-</template>
-<script>
-export default {
-  components: {
-    ObjectProperties: () => import('@/cleanup/components/viewer/ObjectProperties')
-  },
-  props: {
-    resource: { type: Object, default: () => null },
-    isMultiple: { type: Boolean, default: false },
-    expandInitial: { type: Boolean, default: true }
-  },
-  data() {
-    return {
-      expand: this.expandInitial
-    }
-  },
-  computed: {
-    isolated() {
-      let id =
-        this.resource.type === 'commit'
-          ? this.resource.data.commit.referencedObject
-          : this.resource.data.object.id
-      return this.$store.state.isolateValues.indexOf(id) !== -1
-    }
-  },
-  methods: {
-    isolate() {
-      let id =
-        this.resource.type === 'commit'
-          ? this.resource.data.commit.referencedObject
-          : this.resource.data.object.id
-
-      if (this.isolated)
-        this.$store.commit('unisolateObjects', { filterKey: '__parents', filterValues: [id] })
-      else this.$store.commit('isolateObjects', { filterKey: '__parents', filterValues: [id] })
-    }
-  }
-}
-</script>
-<style scoped>
-.list-overlay-dark {
-  background: rgba(40, 40, 40, 0.5);
-  z-index: 5;
-}
-.list-overlay-light {
-  background: rgba(235, 235, 235, 0.5);
-  z-index: 5;
-}
-</style>
diff --git a/packages/frontend/src/cleanup/components/viewer/ResourceGroup.vue b/packages/frontend/src/cleanup/components/viewer/ResourceGroup.vue
index 8879811a4..2ac78f214 100644
--- a/packages/frontend/src/cleanup/components/viewer/ResourceGroup.vue
+++ b/packages/frontend/src/cleanup/components/viewer/ResourceGroup.vue
@@ -1,46 +1,53 @@
 <template>
-  <div>
-    <v-list v-if="resources.length > 1" dense nav class="mt-0 py-0 mb-3">
-      <v-list-item
-        :class="`px-2 list-overlay-${$vuetify.theme.dark ? 'dark' : 'light'} elevation-3`"
-        style="position: sticky; top: 82px"
-        @click="expand = !expand"
-      >
-        <v-list-item-action>
-          <v-icon small>
-            {{
-              resources.length < 10
-                ? 'mdi-numeric-' + resources.length + '-box-multiple'
-                : 'mdi-numeric-9-plus-box-multiple'
-            }}
-          </v-icon>
-        </v-list-item-action>
-        <v-list-item-content>
-          <v-list-item-title>Loaded Resources</v-list-item-title>
-        </v-list-item-content>
-        <v-list-item-action class="pa-0 ma-0">
-          <v-btn small icon @click.stop="expand = !expand">
-            <v-icon>{{ expand ? 'mdi-chevron-up' : 'mdi-chevron-down' }}</v-icon>
-          </v-btn>
-        </v-list-item-action>
-      </v-list-item>
-    </v-list>
+  <div class="mb-2">
     <v-expand-transition>
-      <div v-show="expand" class="mt-3">
-        <resource
+      <div v-show="expand" class="">
+        <div v-for="(resource, index) in resources" :key="index">
+          <commit-info-resource
+            v-if="resource.type === 'commit'"
+            :resource="resource"
+            @remove="
+              (e) => {
+                $emit('remove', e)
+                removedResources.push(e)
+              }
+            "
+          ></commit-info-resource>
+          <object-info-resource
+            v-if="resource.type === 'object'"
+            :resource="resource"
+            @remove="
+              (e) => {
+                $emit('remove', e)
+                removedResources.push(e)
+              }
+            "
+          ></object-info-resource>
+        </div>
+        <div class="px-2 mb-2">
+          <v-btn
+            v-tooltip="'Overlay another commit or object'"
+            block
+            rounded
+            class="primary"
+            @click="$emit('show-add-overlay')"
+          >
+            add
+          </v-btn>
+        </div>
+        <!-- <resource
           v-for="(resource, index) in resources"
           :key="index"
           :resource="resource"
-          :is-multiple="resources.length !== 0"
-          :expand-initial="resources.length === 0"
+          :is-multiple="resources.length > 1"
+          :expand-initial="resources.length === 1 || true"
           @remove="
             (e) => {
               $emit('remove', e)
               removedResources.push(e)
             }
           "
-        />
-
+        /> -->
         <div v-show="removedResources.length !== 0" class="px-3 caption pb-5">
           Removed resources:
           <span v-for="(res, index) in removedResources" :key="index" v-tooltip="'Click to re-add'">
@@ -69,7 +76,8 @@
 <script>
 export default {
   components: {
-    Resource: () => import('@/cleanup/components/viewer/Resource')
+    CommitInfoResource: () => import('@/cleanup/components/viewer/CommitInfoResource'),
+    ObjectInfoResource: () => import('@/cleanup/components/viewer/ObjectInfoResource')
   },
   props: {
     resources: { type: Array, default: () => [] }
diff --git a/packages/frontend/src/cleanup/components/viewer/ViewerControls.vue b/packages/frontend/src/cleanup/components/viewer/ViewerControls.vue
index 0f251f4f0..aa9b35a68 100644
--- a/packages/frontend/src/cleanup/components/viewer/ViewerControls.vue
+++ b/packages/frontend/src/cleanup/components/viewer/ViewerControls.vue
@@ -35,16 +35,6 @@
       >
         <v-icon small>mdi-scissors-cutting</v-icon>
       </v-btn>
-      <v-btn
-        v-tooltip="'Overlay another commit or object'"
-        color="primary"
-        :small="small"
-        rounded
-        class="mr-2"
-        @click="$emit('show-add-overlay')"
-      >
-        <v-icon>mdi-plus</v-icon>
-      </v-btn>
     </v-card>
   </div>
 </template>
diff --git a/packages/frontend/src/cleanup/components/viewer/dialogs/AddOverlay.vue b/packages/frontend/src/cleanup/components/viewer/dialogs/AddOverlay.vue
index cfa6f5752..b35edf8ec 100644
--- a/packages/frontend/src/cleanup/components/viewer/dialogs/AddOverlay.vue
+++ b/packages/frontend/src/cleanup/components/viewer/dialogs/AddOverlay.vue
@@ -115,7 +115,6 @@ export default {
     }
   },
   async mounted() {
-    console.log(this.streamId)
     let res = await this.$apollo.query({
       query: gql`
         query {
diff --git a/packages/frontend/src/cleanup/components/viewer/dialogs/AllCommitsBranch.vue b/packages/frontend/src/cleanup/components/viewer/dialogs/AllCommitsBranch.vue
index 2f1e839dd..764ce1963 100644
--- a/packages/frontend/src/cleanup/components/viewer/dialogs/AllCommitsBranch.vue
+++ b/packages/frontend/src/cleanup/components/viewer/dialogs/AllCommitsBranch.vue
@@ -1,13 +1,7 @@
 <template>
   <div>
-    <v-row v-if="stream" dense>
-      <v-col
-        v-for="commit in stream.branch.commits.items"
-        :key="commit.id + 'card'"
-        cols="12"
-        sm="6"
-        md="4"
-      >
+    <v-row v-if="commits.length != 0" dense>
+      <v-col v-for="commit in commits" :key="commit.id + 'card'" cols="12" sm="6" md="4">
         <v-card @click.stop="$emit('add-resource', commit.id)">
           <preview-image
             :height="180"
@@ -53,83 +47,52 @@ export default {
     SourceAppAvatar: () => import('@/cleanup/components/common/SourceAppAvatar')
   },
   props: ['streamId', 'branchName'],
-  apollo: {
-    stream: {
-      query: gql`
-        query($streamId: String!, $branchName: String!, $cursor: String) {
-          stream(id: $streamId) {
-            id
-            branch(name: $branchName) {
-              name
-              commits(cursor: $cursor, limit: 2) {
-                totalCount
-                cursor
-                items {
-                  sourceApplication
-                  id
-                  createdAt
-                  authorId
-                  branchName
-                  message
-                  referencedObject
-                }
-              }
-            }
-          }
-        }
-      `,
-      variables() {
-        return { streamId: this.streamId, branchName: this.branchName }
-      },
-      skip() {
-        return !this.streamId
-      }
+  data() {
+    return {
+      skip: true,
+      cursor: new Date().toISOString(),
+      commits: []
     }
   },
-  data() {
-    return {}
+  async mounted() {
+    this.fetchBranchCommits()
   },
-  async mounted() {},
   methods: {
-    infiniteHandler($state) {
-      this.$apollo.queries.stream.fetchMore({
-        variables: {
-          cursor: this.stream.branch.commits.cursor,
-          streamId: this.streamId,
-          branchName: this.branchName
-        },
-        // Transform the previous result with new data
-        updateQuery: (previousResult, { fetchMoreResult }) => {
-          const newItems = fetchMoreResult.stream.branch.commits.items
-          if (newItems.length === 0) $state.complete()
-          else $state.loaded()
-
-          let allItems = [...previousResult.stream.branch.commits.items]
-          for (const commit of newItems) {
-            if (allItems.findIndex((c) => c.id === commit.id) === -1) allItems.push(commit)
-          }
-
-          return {
-            stream: {
-              __typename: previousResult.stream.__typename,
-              name: previousResult.stream.name,
-              id: previousResult.stream.id,
-              branch: {
-                id: fetchMoreResult.stream.branch.id,
-                name: fetchMoreResult.stream.branch.name,
-                description: fetchMoreResult.stream.branch.description,
-                __typename: previousResult.stream.branch.__typename,
-                commits: {
-                  __typename: previousResult.stream.branch.commits.__typename,
-                  cursor: fetchMoreResult.stream.branch.commits.cursor,
-                  totalCount: fetchMoreResult.stream.branch.commits.totalCount,
-                  items: allItems
+    async fetchBranchCommits() {
+      let res = await this.$apollo.query({
+        query: gql`
+          query {
+            stream(id: "${this.streamId}") {
+              id
+              branch(name: "${this.branchName}") {
+                name
+                commits( cursor: "${this.cursor}", limit: 2) {
+                  totalCount
+                  cursor
+                  items {
+                    sourceApplication
+                    id
+                    createdAt
+                    authorId
+                    branchName
+                    message
+                    referencedObject
+                  }
                 }
               }
             }
           }
-        }
+        `
       })
+      let items = res.data.stream.branch.commits.items
+      this.cursor = res.data.stream.branch.commits.cursor
+      items.forEach((item) => this.commits.push(item))
+      return items
+    },
+    async infiniteHandler($state) {
+      let items = await this.fetchBranchCommits()
+      if (items.length === 0) $state.complete()
+      else $state.loaded()
     }
   }
 }
diff --git a/packages/frontend/src/cleanup/dialogs/BranchEditDialog.vue b/packages/frontend/src/cleanup/dialogs/BranchEditDialog.vue
index 39661ba24..505a0c373 100644
--- a/packages/frontend/src/cleanup/dialogs/BranchEditDialog.vue
+++ b/packages/frontend/src/cleanup/dialogs/BranchEditDialog.vue
@@ -162,6 +162,7 @@ export default {
       this.showDelete = false
       this.$eventHub.$emit('notification', { text: 'Branch deleted' })
       this.$router.push(`/streams/` + this.$route.params.streamId)
+      this.$eventHub.$emit('branch-refresh')
     },
     async updateBranch() {
       if (!this.$refs.form.validate()) return
diff --git a/packages/frontend/src/cleanup/navigation/MainLogo.vue b/packages/frontend/src/cleanup/navigation/MainLogo.vue
index 7405e2a49..bb57eff48 100644
--- a/packages/frontend/src/cleanup/navigation/MainLogo.vue
+++ b/packages/frontend/src/cleanup/navigation/MainLogo.vue
@@ -26,8 +26,8 @@
       {{ serverInfo.version }}
     </div>
     <div class="flex-grow-1 text-right">
-      <v-btn icon small @click="$emit('hide-drawer')">
-        <v-icon>mdi-chevron-left</v-icon>
+      <v-btn v-tooltip="'Close sidebar'" icon small @click="$emit('hide-drawer')">
+        <v-icon x-small>mdi-close</v-icon>
       </v-btn>
     </div>
   </v-card>
diff --git a/packages/frontend/src/cleanup/pages/stream/CommitObjectViewer.vue b/packages/frontend/src/cleanup/pages/stream/CommitObjectViewer.vue
index 93e87f3c0..d54d6827e 100644
--- a/packages/frontend/src/cleanup/pages/stream/CommitObjectViewer.vue
+++ b/packages/frontend/src/cleanup/pages/stream/CommitObjectViewer.vue
@@ -50,33 +50,22 @@
           </v-list-item>
         </v-list>
 
-        <!-- Selection info -->
-        <v-scroll-y-transition>
-          <transition-group>
-            <object-selection
-              v-show="selectionData.length !== 0"
-              :key="'one'"
-              :objects="selectionData"
-              :stream-id="$route.params.streamId"
-            />
-            <v-divider v-if="isMultiple && selectionData.length !== 0" :key="'two'" class="my-4" />
-          </transition-group>
-        </v-scroll-y-transition>
-
         <!-- Loaded resources  -->
         <resource-group
           :resources="resources"
           @remove="removeResource"
           @add-resource="addResource"
+          @show-add-overlay="showAddOverlay = true"
         />
 
-        <v-divider v-if="isMultiple" class="my-4" />
+        <!-- <v-divider v-if="isMultiple" class="my-4" /> -->
 
         <!-- Views display -->
-        <views-display v-if="views.length !== 0" :views="views" />
+        <views-display v-if="views.length !== 0" :views="views" class="mt-4" />
 
         <!-- Filters display -->
         <filters
+          class="mt-4"
           :props="objectProperties"
           :source-application="
             resources
@@ -110,6 +99,28 @@
       <div style="height: 100vh; width: 100%; top: -64px; left: 0px; position: absolute">
         <viewer @load-progress="captureProgress" @selection="captureSelect" />
       </div>
+
+      <div
+        style="
+          height: 100vh;
+          width: 100%;
+          top: -64px;
+          left: 22px;
+          position: absolute;
+          z-index: 10;
+          pointer-events: none;
+        "
+      >
+        <object-selection
+          v-show="selectionData.length !== 0"
+          :key="'one'"
+          :objects="selectionData"
+          :stream-id="$route.params.streamId"
+          @clear-selection="selectionData = []"
+        />
+      </div>
+
+      <!-- Viewer controls -->
       <div
         :style="`width: 100%; bottom: 12px; left: 0px; position: ${
           $isMobile() ? 'fixed' : 'absolute'
@@ -118,6 +129,7 @@
       >
         <viewer-controls @show-add-overlay="showAddOverlay = true" />
       </div>
+
       <!-- Progress bar -->
       <div v-if="!loadedModel" style="width: 20%; top: 45%; left: 40%; position: absolute">
         <v-progress-linear
@@ -148,7 +160,12 @@
         </h2>
       </error-placeholder>
     </div>
-    <v-dialog v-model="showAddOverlay" width="800" :fullscreen="$vuetify.breakpoint.smAndDown">
+    <v-dialog
+      v-model="showAddOverlay"
+      width="800"
+      :fullscreen="$vuetify.breakpoint.smAndDown"
+      style="z-index: 10000"
+    >
       <stream-overlay-viewer
         :stream-id="$route.params.streamId"
         @add-resource="addResource"
@@ -331,7 +348,6 @@ export default {
         if (!val && this.filterToSet) {
           setTimeout(() => {
             this.$store.commit('setFilterDirect', { filter: this.filterToSet })
-            // window.__viewer.applyFilter(this.filterToSet)
             this.filterToSet = null
           }, 200)
         }
@@ -358,7 +374,6 @@ export default {
             window.__viewer.cameraHandler.activeCam.name === 'ortho' ? 1 : 0,
             controls._zoom
           ]
-          console.log(c)
           let fullQuery = { ...this.$route.query }
           delete fullQuery.c
           this.$router
@@ -369,7 +384,6 @@ export default {
             .catch(() => {})
         }, 1000)
       )
-      // TODO: check query params for filter and camera pos and set them
     }, 300)
   },
   methods: {
diff --git a/packages/frontend/src/cleanup/pages/stream/StreamHome.vue b/packages/frontend/src/cleanup/pages/stream/StreamHome.vue
index 8b58d49e5..2fb86676f 100644
--- a/packages/frontend/src/cleanup/pages/stream/StreamHome.vue
+++ b/packages/frontend/src/cleanup/pages/stream/StreamHome.vue
@@ -4,7 +4,7 @@
       <v-col cols="12">
         <v-card :to="`/streams/${$route.params.streamId}/commits/${stream.commits.items[0].id}`">
           <preview-image
-            :height="320"
+            :height="420"
             :url="`/preview/${$route.params.streamId}/commits/${stream.commits.items[0].id}`"
           ></preview-image>
           <list-item-commit
@@ -19,9 +19,9 @@
       <v-col cols="12" style="height: 20px"></v-col>
       <v-col
         cols="12"
-        :xl="loggedIn ? 4 : 12"
-        class="pa-0 ma-0"
-        :order="`${$vuetify.breakpoint.xlOnly ? 'last' : ''}`"
+        xl="4"
+        :order="`${$vuetify.breakpoint.xl ? 'last' : ''}`"
+        :class="`${$vuetify.breakpoint.xl ? 'pl-4' : ''}`"
       >
         <v-card class="transparent elevation-0">
           <v-toolbar class="transparent elevation-0">
@@ -37,7 +37,7 @@
               cols="12"
               sm="4"
               md="4"
-              :xl="loggedIn ? 12 : 4"
+              xl="12"
             >
               <v-card :to="`/streams/${$route.params.streamId}/branches/${branch.name}`">
                 <preview-image
@@ -56,16 +56,11 @@
                     :color="`grey ${$vuetify.theme.dark ? 'darken-1' : 'lighten-1'}`"
                   ></v-badge>
                 </v-toolbar>
-                <!-- <list-item-commit
-                  :commit="branch.commits.items[0]"
-                  :stream-id="$route.params.streamId"
-                ></list-item-commit> -->
               </v-card>
             </v-col>
           </v-row>
         </v-card>
       </v-col>
-
       <v-col v-if="loggedIn" cols="12" xl="8">
         <v-card class="transparent elevation-0">
           <v-toolbar class="transparent elevation-0">
@@ -74,7 +69,7 @@
           </v-toolbar>
           <v-card-title class="caption" style="margin-top: -30px">Recent activity log</v-card-title>
         </v-card>
-        <div xxstyle="margin-top: -42px" class="mr-0">
+        <div class="mr-0">
           <stream-activity></stream-activity>
         </div>
       </v-col>
diff --git a/packages/frontend/src/cleanup/toolbars/CommitToolbar.vue b/packages/frontend/src/cleanup/toolbars/CommitToolbar.vue
index 8f1144e03..e5666effd 100644
--- a/packages/frontend/src/cleanup/toolbars/CommitToolbar.vue
+++ b/packages/frontend/src/cleanup/toolbars/CommitToolbar.vue
@@ -41,16 +41,16 @@
         </router-link>
       </div>
       <div class="text-truncate flex-shrink-0 hidden-xs-only">
-        <user-avatar
+        <!-- <user-avatar
           :id="stream.commit.authorId"
           :avatar="stream.commit.authorAvatar"
           :name="stream.commit.authorName"
           :size="20"
-        />
-        <span class="caption mr-1">
+        /> -->
+        <!-- <span class="caption mr-1">
           <timeago :datetime="stream.commit.createdAt"></timeago>
-        </span>
-        <source-app-avatar :application-name="stream.commit.sourceApplication" />
+        </span> -->
+        <!-- <source-app-avatar :application-name="stream.commit.sourceApplication" /> -->
         <commit-received-receipts :commit-id="stream.commit.id" :stream-id="stream.id" />
         <v-btn
           v-if="stream && stream.role !== 'stream:reviewer' && stream.commit.authorId === $userId()"
diff --git a/packages/frontend/src/components/SourceAppAvatar.vue b/packages/frontend/src/components/SourceAppAvatar.vue
index 3ebe2b8bd..0cf1169fe 100644
--- a/packages/frontend/src/components/SourceAppAvatar.vue
+++ b/packages/frontend/src/components/SourceAppAvatar.vue
@@ -1,10 +1,9 @@
 <template>
   <v-chip
-    small
+    v-tooltip="`Source Application: ${applicationName ? applicationName : 'unknown'}`"
+    x-small
     class="ma-1 caption white--text no-hover"
     :color="color"
-    :size="size"
-    v-tooltip="`Source Application: ${applicationName ? applicationName : 'unknown'}`"
   >
     {{ shortName }}
   </v-chip>
@@ -12,10 +11,6 @@
 <script>
 export default {
   props: {
-    size: {
-      type: Number,
-      default: 30
-    },
     applicationName: {
       type: String,
       default: '?'