Merge pull request #569 from pixelfed/frontend-ui-refactor

Frontend ui refactor

app/Http/Controllers/InternalApiController.php

@@ -6,12 +6,14 @@ use Illuminate\Http\Request;
 use App\{
     DirectMessage,
     Hashtag,
+    Follower,
     Like,
     Media,
     Notification,
     Profile,
     StatusHashtag,
     Status,
+    UserFilter,
 };
 use Auth,Cache;
 use Carbon\Carbon;
@@ -122,8 +124,16 @@ class InternalApiController extends Controller
     public function discover(Request $request)
     {
         $profile = Auth::user()->profile;
+        $pid = $profile->id;
+        //$following = Cache::get('feature:discover:following:'.$profile->id, []);
+        $following = Follower::whereProfileId($pid)->pluck('following_id');
+
+        $filtered = UserFilter::whereUserId($pid)
+                    ->whereFilterableType('App\Profile')
+                    ->whereIn('filter_type', ['mute', 'block'])
+                    ->pluck('filterable_id')->toArray();
+        $following = array_merge($following->push($pid)->toArray(), $filtered);
 
-        $following = Cache::get('feature:discover:following:'.$profile->id, []);
         $people = Profile::select('id', 'name', 'username')
             ->with('avatar')
             ->inRandomOrder()
@@ -141,7 +151,6 @@ class InternalApiController extends Controller
           })
           ->whereIsNsfw(false)
           ->whereVisibility('public')
-          ->where('profile_id', '<>', $profile->id)
           ->whereNotIn('profile_id', $following)
           ->withCount(['comments', 'likes'])
           ->orderBy('created_at', 'desc')

app/Http/Controllers/SiteController.php

@@ -33,18 +33,14 @@ class SiteController extends Controller
     {
         $pid = Auth::user()->profile->id;
         // TODO: Use redis for timelines
-        $following = Cache::rememberForever("user:following:list:$pid", function() use($pid) {
-          $following = Follower::whereProfileId($pid)->pluck('following_id');
-          $following->push($pid);
-          return $following->toArray();
-        });
 
-        $filtered = Cache::rememberForever("user:filter:list:$pid", function() use($pid) {
+        $following = Follower::whereProfileId($pid)->pluck('following_id');
-          return UserFilter::whereUserId($pid)
+        $following->push($pid)->toArray();
+
+        $filtered = UserFilter::whereUserId($pid)
                     ->whereFilterableType('App\Profile')
                     ->whereIn('filter_type', ['mute', 'block'])
                     ->pluck('filterable_id')->toArray();
-        });
 
         $timeline = Status::whereIn('profile_id', $following)
                   ->whereNotIn('profile_id', $filtered)
@@ -53,6 +49,7 @@ class SiteController extends Controller
                   ->orderBy('created_at', 'desc')
                   ->withCount(['comments', 'likes', 'shares'])
                   ->simplePaginate(20);
+                  
         $type = 'personal';
 
         return view('timeline.template', compact('timeline', 'type'));

app/Http/Controllers/TimelineController.php

@@ -27,14 +27,13 @@ class TimelineController extends Controller
         // $timeline = Timeline::build()->local();
         $pid = Auth::user()->profile->id;
 
-        $filtered = Cache::rememberForever("user:filter:list:$pid", function() use($pid) {
+        $private = Profile::whereIsPrivate(true)->where('id', '!=', $pid)->pluck('id');
-          return UserFilter::whereUserId($pid)
+        $filters = UserFilter::whereUserId($pid)
                   ->whereFilterableType('App\Profile')
                   ->whereIn('filter_type', ['mute', 'block'])
                   ->pluck('filterable_id')->toArray();
-        });
+        $filtered = array_merge($private->toArray(), $filters);
-        $private = Profile::whereIsPrivate(true)->pluck('id');
+
-        $filtered = array_merge($private->toArray(), $filtered);
         $timeline = Status::whereHas('media')
                   ->whereNotIn('profile_id', $filtered)
                   ->whereNull('in_reply_to_id')

config/pixelfed.php

@@ -23,7 +23,7 @@ return [
     | This value is the version of your PixelFed instance.
     |
     */
-    'version' => '0.2.0',
+    'version' => '0.2.1',
 
     /*
     |--------------------------------------------------------------------------

resources/assets/js/components/PostComponent.vue

@@ -124,15 +124,29 @@
           </div>
         </a>
         <div class="float-right">
-          <!-- <div class="dropdown">
+          <div class="post-actions d-none">
+          <div class="dropdown">
             <button class="btn btn-link text-dark no-caret dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="Post options">
             <span class="fas fa-ellipsis-v text-muted"></span>
             </button>
             <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
-              <a class="dropdown-item font-weight-bold" href="#">View Exif</a>
+                <a class="dropdown-item font-weight-bold" :href="reportUrl()">Report</a>
-              <a class="dropdown-item font-weight-bold" href="{{$status->reportUrl()}}">Report</a>
+                <div class="dropdown-divider"></div>
+                <form method="post" action="/i/mute">
+                  <input type="hidden" name="_token" value="">            
+                  <input type="hidden" name="type" value="user">
+                  <input type="hidden" name="item" value="">
+                  <button type="submit" class="dropdown-item btn btn-link font-weight-bold">Mute this user</button>
+                </form>
+                <form method="post" action="/i/block">
+                  <input type="hidden" name="_token" value="">            
+                  <input type="hidden" name="type" value="user">
+                  <input type="hidden" name="item" value="">
+                  <button type="submit" class="dropdown-item btn btn-link font-weight-bold">Block this user</button>
+                </form>
+              </div>
+            </div>
           </div>
-          </div> -->
         </div>
        </div>
         <div class="col-12 col-md-8 status-photo px-0">
@@ -155,13 +169,27 @@
               </div>
             </a>
               <div class="float-right">
+                <div class="post-actions d-none">
                 <div class="dropdown">
                   <button class="btn btn-link text-dark no-caret dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="Post options">
                   <span class="fas fa-ellipsis-v text-muted"></span>
                   </button>
                       <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
-                    <a class="dropdown-item font-weight-bold show-exif">Show Exif</a>
+                        <a class="dropdown-item font-weight-bold" :href="reportUrl()">Report</a>
-                    <a class="dropdown-item font-weight-bold" href="#">Report</a>
+                        <div class="dropdown-divider"></div>
+                        <form method="post" action="/i/mute">
+                          <input type="hidden" name="_token" value="">            
+                          <input type="hidden" name="type" value="user">
+                          <input type="hidden" name="item" value="">
+                          <button type="submit" class="dropdown-item btn btn-link font-weight-bold">Mute this user</button>
+                        </form>
+                        <form method="post" action="/i/block">
+                          <input type="hidden" name="_token" value="">            
+                          <input type="hidden" name="type" value="user">
+                          <input type="hidden" name="item" value="">
+                          <button type="submit" class="dropdown-item btn btn-link font-weight-bold">Block this user</button>
+                        </form>
+                      </div>
                   </div>
                 </div>
               </div>
@@ -209,13 +237,16 @@
               </div>
               <div class="timestamp">
                 <a v-bind:href="statusUrl" class="small text-muted">
-                  November 1, 2018
+                  {{timestampFormat()}}
                 </a>
               </div>
             </div>
           </div>
           <div class="card-footer bg-white sticky-md-bottom">
-            <form class="comment-form" method="post" action="/i/comment" :data-id="statusId" data-truncate="false">
+            <div class="comment-form-guest">
+              <a href="/login">Login</a> to like or comment.
+            </div>
+            <form class="comment-form d-none" method="post" action="/i/comment" :data-id="statusId" data-truncate="false">
               <input type="hidden" name="_token" value="">
               <input type="hidden" name="item" :value="statusId">
 
@@ -290,7 +321,8 @@ export default {
     data() {
         return {
             status: {},
-            media: {}
+            media: {},
+            user: {}
           }
     },
     mounted() {
@@ -301,16 +333,42 @@ export default {
       });
       this.fetchData();
       pixelfed.hydrateLikes();
+      this.authCheck();
     },
     methods: {
+      authCheck() {
+        let authed = $('body').hasClass('loggedIn');
+        if(authed == true) {
+          $('.comment-form-guest').addClass('d-none');
+          $('.comment-form').removeClass('d-none');
+        }
+      },
+      showMuteBlock() {
+        let sid = this.status.account.id;
+        console.log('sid :' + sid);
+        let uid = this.user.id;
+        console.log('uid :' + uid);
+        if(sid != uid) {
+          $('.post-actions').removeClass('d-none');
+        }
+      },
+      reportUrl() {
+        return '/i/report?type=post&id=' + this.status.id;
+      },
+      timestampFormat() {
+          let ts = new Date(this.status.created_at);
+          return ts.toDateString();
+      },
       fetchData() {
           let url = '/api/v2/profile/'+this.statusUsername+'/status/'+this.statusId;
           axios.get(url)
             .then(response => {
                 let self = this;
                 self.status = response.data.status;
+                self.user = response.data.user;
                 self.media = self.status.media_attachments;
                 this.buildPresenter();
+                this.showMuteBlock();
             }).catch(error => {
               if(!error.response) {
                 $('.postPresenterLoader .lds-ring').attr('style','width:100%').addClass('pt-4 font-weight-bold text-muted').text('An error occured, cannot fetch media. Please try again later.');
@@ -335,6 +393,11 @@ export default {
         let status = this.status;
         let media = this.media;
 
+        $('input[name="item"]').each(function(k, v) {
+            let el = $(v);
+            el.val(status.account.id);
+        });
+
         $('.status-comment .comment-text').html(status.content);
 
         if(container.children().length != 0) {

resources/views/layouts/app.blade.php

@@ -26,7 +26,7 @@
     @stack('styles')
 
 </head>
-<body class="">
+<body class="{{Auth::check()?'loggedIn':''}}">
     @include('layouts.partial.nav')
     <main id="content">
         @yield('content')

routes/api.php

@@ -12,9 +12,3 @@ use Illuminate\Http\Request;
 | is assigned the "api" middleware group. Enjoy building your API!
 |
 */
-Route::post('/users/{username}/inbox', 'FederationController@userInbox');
-
-Route::group(['prefix' => 'api/v2'], function() {
-    Route::get('profile/{username}/status/{postid}', 'PublicApiController@status');
-    Route::get('comments/{username}/status/{postId}', 'PublicApiController@statusComments');
-});

routes/web.php

@@ -46,6 +46,8 @@ Route::domain(config('pixelfed.domain.app'))->middleware(['validemail', 'twofact
             Route::get('notifications', 'InternalApiController@notifications');
             Route::post('notifications', 'InternalApiController@notificationMarkAllRead');
             Route::get('discover', 'InternalApiController@discover');
+            Route::get('profile/{username}/status/{postid}', 'PublicApiController@status');
+            Route::get('comments/{username}/status/{postId}', 'PublicApiController@statusComments');
         });
         Route::group(['prefix' => 'local'], function () {
             Route::get('i/follow-suggestions', 'ApiController@followSuggestions');