datatable.directory/resources/views/user/view.blade.php

{{-- User's dashboard / profile page --}}
@extends('layouts.app')

@php
/** @var \App\Models\Table[] $tables */
/** @var \App\Models\User $user */
@endphp

@section('content')
  <div class="container">

    <div class="row justify-content-center">

      {{-- Dash card --}}
      <div class="col-md-4">
        <div class="card">
          <div class="card-header">
            <i class="fa-user-circle-o pr-1"></i>
            {{ $user->title }}

            @if(authed() && user()->is($user))
              <a href="{{route('user.edit')}}" class="btn btn-sm btn-outline-light float-right">Edit</a>
            @endif
          </div>

          <div class="card-body">
            @if (session('status'))
              <div class="alert alert-success" role="alert">
                {{ session('status') }}
              </div>
            @endif

            @if($user->bio)
              @if(mb_strlen($user->bio) > 250)
                <p id="bio-short" aria-hidden=true>
                  {{mb_substr($user->bio, 0, 250)}}…
                  <a class="text-muted small" title="Show more" href="#" onclick="$('#bio-short').addClass('hidden'); $('#bio-full').removeClass('hidden'); return false;">
                    [more]
                  </a>
                </p>
                <p id="bio-full" class="hidden">
                  {{ $user->bio }}
                  <a class="text-muted small" title="Collapse" href="#" onclick="$('#bio-full').addClass('hidden'); $('#bio-short').removeClass('hidden'); return false;">
                    [collapse]
                  </a>
                </p>
              @else
                <p>
                  {{ $user->bio }}
                </p>
              @endif
            @endif

            @if($user->website)
              <p>
                <i class="fa-link fa-pr" aria-label="User's Website" title="User's Website"></i>{{--
                --}}<a href="{{ $user->website }}">{{ $user->website }}</a>
              </p>
            @endif

            <p class="mb-0">
              <i class="fa-calendar fa-pr" aria-hidden=true></i>{{--
              --}}Joined {{ $user->created_at->diffForHumans() }}
            </p>
          </div>
        </div>
      </div>

      {{-- Table list card --}}
      <div class="col-md-8">
        <div class="card">
          <div class="card-header">
            <span class="d-inline-block">
              @if(authed() && user()->is($user))
                Your Tables
              @else
                User's Tables
              @endif
            </span>

            @if(authed() && user()->is($user))
              <a href="{{route('table.create')}}" class="btn btn-sm btn-outline-light float-right">New</a>
            @endif
          </div>

          <div class="list-group list-group-flush">
            @if(count($tables) == 0)
              <span class="list-group-item">No tables yet.</span>
            @else
              @foreach($tables as $table)
                <a class="list-group-item list-group-item-action"
                   href="{{route('table.view', ['user' => $user->name, 'table' => $table->name])}}">
                  <span class="d-block row">
                    <span class="d-inline-block col-10">
                      <i class="fa-table fa-pr"></i>{{ $table->title }}
                    </span>{{--
                    --}}<span class="d-inline-block col-2 small text-right">
                      {{ $table->revision->row_count }} rows
                    </span>
                  </span>

                  <span class="d-block small row">
                    <span class="d-inline-block col-8">
                      {{ ellipsis($table->description, 215) }}
                    </span>{{--
                    --}}<span class="d-inline-block col-4 text-right text-muted">
                      Last change {{ $table->updated_at->diffForHumans() }}
                    </span>
                  </span>
                </a>
              @endforeach
              {{ $tables->links() }}
            @endif
          </div>
        </div>
      </div>

    </div>
  </div>
@endsection