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

Frontend ui refactor

app/FollowRequest.php

@@ -6,6 +6,8 @@ use Illuminate\Database\Eloquent\Model;
 
 class FollowRequest extends Model
 {
+	protected $fillable = ['follower_id', 'following_id'];
+	
     public function follower()
     {
         return $this->belongsTo(Profile::class, 'follower_id', 'id');

app/Http/Controllers/AccountController.php

@@ -3,6 +3,9 @@
 namespace App\Http\Controllers;
 
 use App\EmailVerification;
+use App\Follower;
+use App\FollowRequest;
+use App\Jobs\FollowPipeline\FollowPipeline;
 use App\Mail\ConfirmEmail;
 use App\Notification;
 use App\Profile;
@@ -236,4 +239,43 @@ class AccountController extends Controller
 
         return redirect()->back();
     }
+
+    public function followRequests(Request $request)
+    {
+        $pid = Auth::user()->profile->id;
+        $followers = FollowRequest::whereFollowingId($pid)->orderBy('id','desc')->whereIsRejected(0)->simplePaginate(10);
+        return view('account.follow-requests', compact('followers'));
+    }
+
+    public function followRequestHandle(Request $request)
+    {
+        $this->validate($request, [
+            'action' => 'required|string|max:10',
+            'id' => 'required|integer|min:1'
+        ]);
+
+        $pid = Auth::user()->profile->id;
+        $action = $request->input('action') === 'accept' ? 'accept' : 'reject';
+        $id = $request->input('id');
+        $followRequest = FollowRequest::whereFollowingId($pid)->findOrFail($id);
+        $follower = $followRequest->follower;
+
+        switch ($action) {
+            case 'accept':
+                $follow = new Follower();
+                $follow->profile_id = $follower->id;
+                $follow->following_id = $pid;
+                $follow->save();
+                FollowPipeline::dispatch($follow);
+                $followRequest->delete();
+                break;
+
+            case 'reject':
+                $followRequest->is_rejected = true;
+                $followRequest->save();
+                break;
+        }
+
+        return response()->json(['msg' => 'success'], 200);
+    }
 }

app/Http/Controllers/FollowerController.php

@@ -34,10 +34,10 @@ class FollowerController extends Controller
         $isFollowing = Follower::whereProfileId($user->id)->whereFollowingId($target->id)->count();
 
         if($private == true && $isFollowing == 0) {
-            $follow = new FollowRequest;
-            $follow->follower_id = $user->id;
-            $follow->following_id = $target->id;
-            $follow->save();
+            $follow = FollowRequest::firstOrCreate([
+                'follower_id' => $user->id,
+                'following_id' => $target->id
+            ]);
         } elseif ($isFollowing == 0) {
             $follower = new Follower();
             $follower->profile_id = $user->id;

app/Http/Controllers/ProfileController.php

@@ -50,12 +50,13 @@ class ProfileController extends Controller
             $isBlocked = $this->blockedProfileCheck($user);
         }
 
+        $owner = $loggedIn && Auth::id() === $user->user_id;
+        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
+
         if ($isPrivate == true || $isBlocked == true) {
-            return view('profile.private', compact('user'));
+            return view('profile.private', compact('user', 'is_following'));
         } 
 
-        $owner = $loggedIn && Auth::id() === $user->user_id;
-        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
         $is_admin = is_null($user->domain) ? $user->user->is_admin : false;
         $timeline = $user->statuses()
               ->whereHas('media')
@@ -142,6 +143,8 @@ class ProfileController extends Controller
     {
         $profile = $user = Profile::whereUsername($username)->firstOrFail();
         // TODO: fix $profile/$user mismatch in profile & follower templates
+        $owner = Auth::check() && Auth::id() === $user->user_id;
+        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
         if($profile->is_private || Auth::check()) {
             $blocked = $this->blockedProfileCheck($profile);
             $check = $this->privateProfileCheck($profile, null);
@@ -149,8 +152,6 @@ class ProfileController extends Controller
                 return view('profile.private', compact('user'));
             }
         }
-        $owner = Auth::check() && Auth::id() === $user->user_id;
-        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
         $followers = $profile->followers()->orderBy('created_at', 'desc')->simplePaginate(12);
         $is_admin = is_null($user->domain) ? $user->user->is_admin : false;
         if ($user->remote_url) {
@@ -166,6 +167,8 @@ class ProfileController extends Controller
     {
         $profile = $user = Profile::whereUsername($username)->firstOrFail();
         // TODO: fix $profile/$user mismatch in profile & follower templates
+        $owner = Auth::check() && Auth::id() === $user->user_id;
+        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
         if($profile->is_private || Auth::check()) {
             $blocked = $this->blockedProfileCheck($profile);
             $check = $this->privateProfileCheck($profile, null);
@@ -173,9 +176,6 @@ class ProfileController extends Controller
                 return view('profile.private', compact('user'));
             }
         }
-        $user = $profile;
-        $owner = Auth::check() && Auth::id() === $user->user_id;
-        $is_following = ($owner == false && Auth::check()) ? $user->followedBy(Auth::user()->profile) : false;
         $following = $profile->following()->orderBy('created_at', 'desc')->simplePaginate(12);
         $is_admin = is_null($user->domain) ? $user->user->is_admin : false;
         if ($user->remote_url) {

resources/views/account/activity.blade.php

@@ -5,15 +5,18 @@
   <div class="col-12 col-md-8 offset-md-2">
     <div class="card mt-3">
       <div class="card-body p-0">
-        <ul class="nav nav-tabs d-flex text-center">
-          {{--
-            <li class="nav-item flex-fill">
-              <a class="nav-link font-weight-bold text-uppercase" href="{{route('notifications.following')}}">Following</a>
-            </li> 
-          --}}
+        <ul class="nav nav-pills d-flex text-center">
+        
+          {{-- <li class="nav-item flex-fill">
+            <a class="nav-link font-weight-bold text-uppercase" href="#">Following</a>
+          </li> --}} 
+        
           <li class="nav-item flex-fill">
             <a class="nav-link font-weight-bold text-uppercase active" href="{{route('notifications')}}">My Notifications</a>
           </li>
+          <li class="nav-item flex-fill">
+            <a class="nav-link font-weight-bold text-uppercase" href="{{route('follow-requests')}}">Follow Requests</a>
+          </li> 
         </ul>
       </div>
     </div>

resources/views/account/follow-requests.blade.php

@@ -0,0 +1,72 @@
+@extends('layouts.app')
+
+@section('content')
+<div class="container notification-page" style="min-height: 60vh;">
+  <div class="col-12 col-md-8 offset-md-2">
+    <div class="card mt-3">
+      <div class="card-body p-0">
+        <ul class="nav nav-pills d-flex text-center">
+          <li class="nav-item flex-fill">
+            <a class="nav-link font-weight-bold text-uppercase" href="{{route('notifications')}}">My Notifications</a>
+          </li>
+          <li class="nav-item flex-fill">
+            <a class="nav-link font-weight-bold text-uppercase active" href="{{route('follow-requests')}}">Follow Requests</a>
+          </li> 
+        </ul>
+      </div>
+    </div>
+    <ul class="list-group">
+      @foreach($followers as $follow)
+      <li class="list-group-item notification border-0">
+          <span class="notification-icon pr-3">
+            <img src="{{$follow->follower->avatarUrl()}}" width="32px" class="rounded-circle">
+          </span>
+          <span class="notification-text">
+            <span class="font-weight-bold">{{$follow->follower->username}}</span> {{__('wants to follow you')}}
+            <span class="text-muted notification-timestamp pl-1">{{$follow->created_at->diffForHumans(null, true, true)}}</span>
+          </span>
+          <span class="float-right">
+            <div class="btn-group" role="group" aria-label="Basic example">
+              <button type="button" class="btn btn-outline-default request-action" data-id="{{$follow->id}}" data-action="reject"><i class="fas fa-times text-danger"></i></button>
+              <button type="button" class="btn btn-outline-default request-action" data-id="{{$follow->id}}" data-action="accept"><i class="fas fa-check text-success"></i></button>
+            </div>
+          </span>
+      </li>
+      @endforeach
+    </ul>
+
+    <div class="d-flex justify-content-center my-4">
+      {{$followers->links()}}
+    </div>
+
+  </div>
+</div>
+@endsection
+
+@push('scripts')
+<script type="text/javascript">
+$(document).ready(function() {
+  $(document).on('click', '.request-action', function(e) {
+    e.preventDefault();
+    let el = $(this);
+    let action = el.data('action');
+    let id = el.data('id');
+
+    axios.post(window.location.href, {
+      action: action,
+      id: id
+    }).then((res) => {
+      if(action == 'accept') {
+        swal('Successfully accepted!', 'You have successfully approved that follow request.', 'success');
+      } else {
+        swal('Successfully rejected!', 'You have successfully rejected that follow request.', 'success');
+      }
+    }).catch((res) => {
+      swal('Oops!', 'Something went wrong, please try again later', 'error');
+    });
+    let parent = el.parents().eq(2);
+    parent.fadeOut();
+  });
+});
+</script>
+@endpush

resources/views/profile/partial/private-info.blade.php

@@ -10,6 +10,23 @@
         <div class="profile-details">
           <div class="username-bar pb-2 d-flex align-items-center">
             <span class="font-weight-ultralight h1">{{$user->username}}</span>
+            @if(Auth::check() && $is_following == true)
+            <span class="pl-4">
+              <form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="unfollow">
+                @csrf
+                <input type="hidden" name="item" value="{{$user->id}}">
+                <button class="btn btn-outline-secondary font-weight-bold px-4 py-0" type="submit">Unfollow</button>
+              </form>
+            </span>
+            @elseif(Auth::check() && $is_following == false)
+            <span class="pl-4">
+              <form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="follow">
+                @csrf
+                <input type="hidden" name="item" value="{{$user->id}}">
+                <button class="btn btn-primary font-weight-bold px-4 py-0" type="submit">Follow</button>
+              </form>
+            </span>
+            @endif
           </div>
           <div class="profile-stats pb-3 d-inline-flex lead">
             <div class="font-weight-light pr-5">

resources/views/profile/partial/user-info.blade.php

@@ -19,7 +19,7 @@
             <span class="pl-4">
             <a class="fas fa-cog fa-lg text-muted" href="{{route('settings')}}"></a>
             </span>
-            @elseif ($is_following == true)
+            @elseif (Auth::check() && $is_following == true)
             <span class="pl-4">
               <form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="unfollow">
                 @csrf
@@ -27,7 +27,7 @@
                 <button class="btn btn-outline-secondary font-weight-bold px-4 py-0" type="submit">Unfollow</button>
               </form>
             </span>
-            @elseif ($is_following == false)
+            @elseif (Auth::check() && $is_following == false)
             <span class="pl-4">
               <form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="follow">
                 @csrf

routes/web.php

@@ -88,6 +88,8 @@ Route::domain(config('pixelfed.domain.app'))->middleware('validemail')->group(fu
     Route::group(['prefix' => 'account'], function () {
         Route::redirect('/', '/');
         Route::get('activity', 'AccountController@notifications')->name('notifications');
+        Route::get('follow-requests', 'AccountController@followRequests')->name('follow-requests');
+        Route::post('follow-requests', 'AccountController@followRequestHandle');
     });
 
     Route::group(['prefix' => 'settings'], function () {