Merge branch 'develop' of ssh.gitgud.io:lambadalambda/pleroma-fe into develop

9 files changed, 44 insertions, 12 deletions

diff --git a/src/App.js b/src/App.js
index 03421c62..4b0e81d0 100644
--- a/src/App.js
+++ b/src/App.js
@@ -14,7 +14,11 @@ export default {
   }),
   computed: {
     currentUser () { return this.$store.state.users.currentUser },
-    style () { return { 'background-image': `url(${this.currentUser.background_image})` } },
+    background () {
+      return this.currentUser.background_image || this.$store.state.config.background
+    },
+    logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } },
+    style () { return { 'background-image': `url(${this.background})` } },
     sitename () { return this.$store.state.config.name }
   },
   methods: {
diff --git a/src/App.scss b/src/App.scss
index e5d4c74f..b7bbf8ef 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -63,6 +63,10 @@ nav {
         align-items: center;
         flex-basis: 920px;
         margin: auto;
+        height: 50px;
+        background-repeat: no-repeat;
+        background-position: center;
+        background-size: contain;
     }
 }
 
diff --git a/src/App.vue b/src/App.vue
index fc510fda..7bd79280 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="app" v-bind:style="style" class="base02-background">
     <nav class='container base01-background base04'>
-      <div class='inner-nav'>
+      <div class='inner-nav' :style="logoStyle">
         <div class='item'>
           <a route-to='friends-timeline' href="#">{{sitename}}</a>
         </div>
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 3d1d50fb..030e22b5 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -3,6 +3,7 @@ import FavoriteButton from '../favorite_button/favorite_button.vue'
 import RetweetButton from '../retweet_button/retweet_button.vue'
 import DeleteButton from '../delete_button/delete_button.vue'
 import PostStatusForm from '../post_status_form/post_status_form.vue'
+import UserCardContent from '../user_card_content/user_card_content.vue'
 
 const Status = {
   props: [
@@ -12,7 +13,8 @@ const Status = {
   data: () => ({
     replying: false,
     expanded: false,
-    unmuted: false
+    unmuted: false,
+    userExpanded: false
   }),
   computed: {
     retweet () { return !!this.statusoid.retweeted_status },
@@ -34,7 +36,8 @@ const Status = {
     FavoriteButton,
     RetweetButton,
     DeleteButton,
-    PostStatusForm
+    PostStatusForm,
+    UserCardContent
   },
   methods: {
     toggleReplying () {
@@ -45,6 +48,9 @@ const Status = {
     },
     toggleMute () {
       this.unmuted = !this.unmuted
+    },
+    toggleUserExpanded () {
+      this.userExpanded = !this.userExpanded
     }
   }
 }
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index c215a00b..0c004936 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -18,10 +18,13 @@
       <div class="media status container">
         <div class="media-left">
           <a :href="status.user.statusnet_profile_url">
-            <img class='avatar' :src="status.user.profile_image_url_original">
+            <img @click.prevent="toggleUserExpanded" class='avatar' :src="status.user.profile_image_url_original">
           </a>
         </div>
         <div class="media-body">
+          <div class="base05 base05=border usercard" v-if="userExpanded">
+            <user-card-content :user="status.user"></user-card-content>
+          </div>
           <div class="user-content">
             <h4 class="media-heading">
               {{status.user.name}}
@@ -147,4 +150,11 @@
    display: block;
    margin-left: auto;
  }
+
+ .usercard {
+   border-style: solid;
+   border-width: 1px;
+   border-radius: 1em;
+   margin-bottom: 1em;
+ }
 </style>
diff --git a/src/main.js b/src/main.js
index 9917ccd9..dfff1444 100644
--- a/src/main.js
+++ b/src/main.js
@@ -39,7 +39,8 @@ const store = new Vuex.Store({
     api: apiModule,
     config: configModule
   },
-  plugins: [createPersistedState(persistedStateOptions)]
+  plugins: [createPersistedState(persistedStateOptions)],
+  strict: process.env.NODE_ENV !== 'production'
 })
 
 const routes = [
@@ -72,7 +73,9 @@ new Vue({
 
 window.fetch('/static/config.json')
   .then((res) => res.json())
-  .then(({name, theme}) => {
+  .then(({name, theme, background, logo}) => {
     store.dispatch('setOption', { name: 'name', value: name })
     store.dispatch('setOption', { name: 'theme', value: theme })
+    store.dispatch('setOption', { name: 'background', value: background })
+    store.dispatch('setOption', { name: 'logo', value: logo })
   })
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index b1aa404a..871172b5 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -153,16 +153,18 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
       }
     }
 
+    // Decide if we should treat the status as new for this timeline.
+    let resultForCurrentTimeline
     // Some statuses should only be added to the global status repository.
     if (timeline && addToTimeline) {
-      mergeOrAdd(timelineObject.statuses, status)
+      resultForCurrentTimeline = mergeOrAdd(timelineObject.statuses, status)
     }
 
     if (timeline && showImmediately) {
       // Add it directly to the visibleStatuses, don't change
       // newStatusCount
       mergeOrAdd(timelineObject.visibleStatuses, status)
-    } else if (timeline && addToTimeline && result.new) {
+    } else if (timeline && addToTimeline && resultForCurrentTimeline.new) {
       // Just change newStatuscount
       timelineObject.newStatusCount += 1
     }
diff --git a/src/modules/users.js b/src/modules/users.js
index dd65afe1..ae90abbd 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -33,6 +33,9 @@ export const mutations = {
   },
   addNewUsers (state, users) {
     each(users, (user) => mergeOrAdd(state.users, user))
+  },
+  setUserForStatus (state, status) {
+    status.user = find(state.users, status.user)
   }
 }
 
@@ -54,11 +57,11 @@ const users = {
 
       // Reconnect users to statuses
       each(statuses, (status) => {
-        status.user = find(store.state.users, status.user)
+        store.commit('setUserForStatus', status)
       })
       // Reconnect users to retweets
       each(compact(map(statuses, 'retweeted_status')), (status) => {
-        status.user = find(store.state.users, status.user)
+        store.commit('setUserForStatus', status)
       })
     },
     loginUser (store, userCredentials) {
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index 79b68b38..0a5be77d 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -34,7 +34,7 @@ const setStyle = (href) => {
 
     styleSheet.insertRule(`a { color: ${base08Color}`, 'index-max')
     styleSheet.insertRule(`body { color: ${base05Color}`, 'index-max')
-    styleSheet.insertRule(`.base05-border { color: ${base05Color}`, 'index-max')
+    styleSheet.insertRule(`.base05-border { border-color: ${base05Color}`, 'index-max')
     body.style.display = 'initial'
   }
   cssEl.addEventListener('load', setDynamic)