Skip to content

Commit bc691ae

Browse files
mckenzieartsmckenziearts
committed
✨ ajout de la page dashboard
1 parent 45572a6 commit bc691ae

File tree

7 files changed

+186
-39
lines changed

7 files changed

+186
-39
lines changed

‎app/Http/Controllers/User/DashboardController.php‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,10 @@ public function dashboard()
1212
{
1313
return view('user.dashboard', [
1414
'user' => $user = Auth::user(),
15-
'articles' => $user->articles()->latest()->paginate(10),
15+
'articles' => $user->articles()
16+
->orderByDesc('submitted_at')
17+
->orderByDesc('created_at')
18+
->paginate(5),
1619
]);
1720
}
1821

‎app/Models/User.php‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -221,6 +221,11 @@ public function twitter(): ?string
221221
return $this->twitter_profile;
222222
}
223223

224+
public function hasTwitterAccount(): bool
225+
{
226+
return ! empty($this->twitter());
227+
}
228+
224229
public function linkedin(): ?string
225230
{
226231
return $this->linkedin_profile;

‎public/css/app.css‎

Lines changed: 54 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -5036,12 +5036,12 @@ select {
50365036
.gap-1 {
50375037
gap: 0.25rem;
50385038
}
5039-
.gap-3 {
5040-
gap: 0.75rem;
5041-
}
50425039
.gap-5 {
50435040
gap: 1.25rem;
50445041
}
5042+
.gap-3 {
5043+
gap: 0.75rem;
5044+
}
50455045
.gap-y-12 {
50465046
row-gap: 3rem;
50475047
}
@@ -5064,6 +5064,10 @@ select {
50645064
-moz-column-gap: 1.25rem;
50655065
column-gap: 1.25rem;
50665066
}
5067+
.gap-x-4 {
5068+
-moz-column-gap: 1rem;
5069+
column-gap: 1rem;
5070+
}
50675071
.gap-x-3 {
50685072
-moz-column-gap: 0.75rem;
50695073
column-gap: 0.75rem;
@@ -5078,10 +5082,6 @@ select {
50785082
.gap-y-2 {
50795083
row-gap: 0.5rem;
50805084
}
5081-
.gap-x-4 {
5082-
-moz-column-gap: 1rem;
5083-
column-gap: 1rem;
5084-
}
50855085
.space-y-12 > :not([hidden]) ~ :not([hidden]) {
50865086
--tw-space-y-reverse: 0;
50875087
margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
@@ -5472,10 +5472,6 @@ select {
54725472
--tw-bg-opacity: 1;
54735473
background-color: rgba(209, 250, 229, var(--tw-bg-opacity));
54745474
}
5475-
.bg-green-500 {
5476-
--tw-bg-opacity: 1;
5477-
background-color: rgba(16, 185, 129, var(--tw-bg-opacity));
5478-
}
54795475
.bg-blue-100 {
54805476
--tw-bg-opacity: 1;
54815477
background-color: rgba(219, 234, 254, var(--tw-bg-opacity));
@@ -5484,6 +5480,10 @@ select {
54845480
--tw-bg-opacity: 1;
54855481
background-color: rgba(var(--color-menu-fill), var(--tw-bg-opacity));
54865482
}
5483+
.bg-green-500 {
5484+
--tw-bg-opacity: 1;
5485+
background-color: rgba(16, 185, 129, var(--tw-bg-opacity));
5486+
}
54875487
.bg-skin-footer {
54885488
--tw-bg-opacity: 1;
54895489
background-color: rgba(var(--color-footer-fill), var(--tw-bg-opacity));
@@ -5496,6 +5496,10 @@ select {
54965496
--tw-bg-opacity: 1;
54975497
background-color: rgba(248, 113, 113, var(--tw-bg-opacity));
54985498
}
5499+
.bg-indigo-600 {
5500+
--tw-bg-opacity: 1;
5501+
background-color: rgba(79, 70, 229, var(--tw-bg-opacity));
5502+
}
54995503
.bg-skin-link {
55005504
--tw-bg-opacity: 1;
55015505
background-color: rgba(var(--color-link-fill), var(--tw-bg-opacity));
@@ -5611,6 +5615,14 @@ select {
56115615
--tw-bg-opacity: 1;
56125616
background-color: rgba(220, 38, 38, var(--tw-bg-opacity));
56135617
}
5618+
.bg-blue-500 {
5619+
--tw-bg-opacity: 1;
5620+
background-color: rgba(59, 130, 246, var(--tw-bg-opacity));
5621+
}
5622+
.bg-yellow-100 {
5623+
--tw-bg-opacity: 1;
5624+
background-color: rgba(254, 243, 199, var(--tw-bg-opacity));
5625+
}
56145626
.bg-opacity-10 {
56155627
--tw-bg-opacity: 0.1;
56165628
}
@@ -6275,10 +6287,18 @@ select {
62756287
--tw-text-opacity: 1;
62766288
color: rgba(127, 29, 29, var(--tw-text-opacity));
62776289
}
6290+
.text-blue-800 {
6291+
--tw-text-opacity: 1;
6292+
color: rgba(30, 64, 175, var(--tw-text-opacity));
6293+
}
62786294
.text-gray-900 {
62796295
--tw-text-opacity: 1;
62806296
color: rgba(17, 24, 39, var(--tw-text-opacity));
62816297
}
6298+
.text-gray-600 {
6299+
--tw-text-opacity: 1;
6300+
color: rgba(75, 85, 99, var(--tw-text-opacity));
6301+
}
62826302
.underline {
62836303
text-decoration: underline;
62846304
}
@@ -6749,6 +6769,11 @@ html {
67496769
background-color: rgba(var(--color-body-fill), var(--tw-bg-opacity));
67506770
}
67516771

6772+
.hover\:bg-indigo-700:hover {
6773+
--tw-bg-opacity: 1;
6774+
background-color: rgba(67, 56, 202, var(--tw-bg-opacity));
6775+
}
6776+
67526777
.hover\:bg-gray-800:hover {
67536778
--tw-bg-opacity: 1;
67546779
background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
@@ -6929,6 +6954,11 @@ html {
69296954
color: rgba(41, 170, 236, var(--tw-text-opacity));
69306955
}
69316956

6957+
.hover\:text-\[\#004182\]:hover {
6958+
--tw-text-opacity: 1;
6959+
color: rgba(0, 65, 130, var(--tw-text-opacity));
6960+
}
6961+
69326962
.hover\:text-skin-muted:hover {
69336963
--tw-text-opacity: 1;
69346964
color: rgba(var(--color-text-muted), var(--tw-text-opacity));
@@ -6974,16 +7004,6 @@ html {
69747004
color: rgba(24, 24, 27, var(--tw-text-opacity));
69757005
}
69767006

6977-
.hover\:text-\[\#0077b5\]:hover {
6978-
--tw-text-opacity: 1;
6979-
color: rgba(0, 119, 181, var(--tw-text-opacity));
6980-
}
6981-
6982-
.hover\:text-\[\#004182\]:hover {
6983-
--tw-text-opacity: 1;
6984-
color: rgba(0, 65, 130, var(--tw-text-opacity));
6985-
}
6986-
69877007
.hover\:underline:hover {
69887008
text-decoration: underline;
69897009
}
@@ -7175,6 +7195,11 @@ html {
71757195
--tw-ring-color: rgba(37, 99, 235, var(--tw-ring-opacity));
71767196
}
71777197

7198+
.focus\:ring-indigo-500:focus {
7199+
--tw-ring-opacity: 1;
7200+
--tw-ring-color: rgba(99, 102, 241, var(--tw-ring-opacity));
7201+
}
7202+
71787203
.focus\:ring-primary-600:focus {
71797204
--tw-ring-opacity: 1;
71807205
--tw-ring-color: rgba(22, 163, 74, var(--tw-ring-opacity));
@@ -7647,10 +7672,6 @@ html {
76477672
grid-template-columns: none;
76487673
}
76497674

7650-
.sm\:grid-cols-4 {
7651-
grid-template-columns: repeat(4, minmax(0, 1fr));
7652-
}
7653-
76547675
.sm\:flex-row {
76557676
flex-direction: row;
76567677
}
@@ -8712,6 +8733,10 @@ html {
87128733
margin-left: 1.5rem;
87138734
}
87148735

8736+
.md\:ml-4 {
8737+
margin-left: 1rem;
8738+
}
8739+
87158740
.md\:block {
87168741
display: block;
87178742
}
@@ -8740,6 +8765,10 @@ html {
87408765
grid-template-columns: repeat(2, minmax(0, 1fr));
87418766
}
87428767

8768+
.md\:items-center {
8769+
align-items: center;
8770+
}
8771+
87438772
.md\:justify-between {
87448773
justify-content: space-between;
87458774
}
@@ -9648,11 +9677,6 @@ html {
96489677
line-height: 1.75rem;
96499678
}
96509679

9651-
.lg\:text-3xl {
9652-
font-size: 1.875rem;
9653-
line-height: 2.25rem;
9654-
}
9655-
96569680
.lg\:leading-\[3\.5rem\] {
96579681
line-height: 3.5rem;
96589682
}

‎resources/views/components/user/stats.blade.php‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@props(['user'])
22

33
<dl class="mt-5 grid grid-cols-1 sm:grid-cols-2 gap-5 lg:grid-cols-4">
4-
<div class="px-4 py-5 bg-skin-card-gray shadow rounded-lg overflow-hidden sm:p-6">
4+
<div class="px-4 py-5 bg-skin-card-gray shadow-sm rounded-lg overflow-hidden sm:p-6">
55
<dt class="text-sm font-medium text-skin-base truncate font-sans">
66
Total Articles/Discussions
77
</dt>
@@ -10,7 +10,7 @@
1010
</dd>
1111
</div>
1212

13-
<div class="px-4 py-5 bg-skin-card-gray shadow rounded-lg overflow-hidden sm:p-6">
13+
<div class="px-4 py-5 bg-skin-card-gray shadow-sm rounded-lg overflow-hidden sm:p-6">
1414
<dt class="text-sm font-medium text-skin-base truncate font-sans">
1515
Total Réponses
1616
</dt>
@@ -19,7 +19,7 @@
1919
</dd>
2020
</div>
2121

22-
<div class="px-4 py-5 bg-skin-card-gray shadow rounded-lg overflow-hidden sm:p-6">
22+
<div class="px-4 py-5 bg-skin-card-gray shadow-sm rounded-lg overflow-hidden sm:p-6">
2323
<dt class="text-sm font-medium text-skin-base truncate font-sans">
2424
Sujets Résolus
2525
</dt>
@@ -28,7 +28,7 @@
2828
</dd>
2929
</div>
3030

31-
<div class="px-4 py-5 bg-skin-card-gray shadow rounded-lg overflow-hidden sm:p-6">
31+
<div class="px-4 py-5 bg-skin-card-gray shadow-sm rounded-lg overflow-hidden sm:p-6">
3232
<dt class="text-sm font-medium text-skin-base truncate font-sans">
3333
Total Experience
3434
</dt>

‎resources/views/livewire/articles/_form.blade.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<x-heroicon-o-chevron-left class="h-5 w-5 mr-1.5" />
66
Tous les articles
77
</a>
8-
<a href="#" class="flex items-center pl-3 font-sans text-skin-base text-base font-medium">Mes articles</a>
8+
<a href="{{ route('dashboard') }}" class="flex items-center pl-3 font-sans text-skin-base text-base font-medium">Mes articles</a>
99
</div>
1010
<div class="flex items-center space-x-2 mt-3 sm:mt-0">
1111
@hasanyrole('admin|moderator')

‎resources/views/user/dashboard.blade.php‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,122 @@
2020
<x-user.sidebar :user="$user" />
2121
</div>
2222
<main class="lg:col-span-9">
23+
<div class="md:flex md:items-center md:justify-between">
24+
<div class="flex-1 min-w-0">
25+
<h2 class="text-lg font-bold leading-7 text-skin-inverted sm:text-xl sm:truncate font-sans">
26+
Vos articles
27+
</h2>
28+
</div>
29+
<div class="mt-4 flex md:mt-0 md:ml-4">
30+
<x-button :link="route('articles.new')" class="ml-3">
31+
Nouvel article
32+
</x-button>
33+
</div>
34+
</div>
2335

36+
<div class="mt-5">
37+
@unless(Auth::user()->hasTwitterAccount())
38+
<div class="bg-blue-500 bg-opacity-10 text-blue-800 text-sm p-3 rounded-md font-normal mb-6">
39+
<x-heroicon-s-information-circle class="h-5 w-5 inline-block mr-1" />
40+
Complétez votre <a href="{{ route('user.settings') }}" class="underline">identifiant Twitter</a> pour que nous puissions faire un lien vers votre profil lorsque nous tweetons votre article.
41+
</div>
42+
@endunless
43+
44+
@forelse($articles as $article)
45+
<div class="pb-8 mb-8 border-b border-skin-base">
46+
<div class="flex items-center space-x-3">
47+
@if ($article->isNotPublished())
48+
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">
49+
Brouillon
50+
</span>
51+
@endif
52+
53+
@foreach ($article->tags as $tag)
54+
<x-tag :tag="$tag" />
55+
@endforeach
56+
</div>
57+
58+
<a href="{{ route('articles.show', $article->slug()) }}" class="block">
59+
<div class="mt-4 flex justify-between items-center">
60+
<h3 class="text-xl leading-7 font-semibold text-skin-inverted font-sans hover:text-skin-primary">
61+
{{ $article->title }}
62+
</h3>
63+
64+
<div class="flex items-center text-skin-muted font-sans">
65+
<a href="{{ route('articles.show', $article->slug()) }}" class="hover:text-skin-base hover:underline">
66+
Voir
67+
</a>
68+
<span class="mx-1">
69+
&middot;
70+
</span>
71+
<a href="{{ route('articles.edit', $article->slug()) }}" class="hover:text-skin-base hover:underline">
72+
Éditer
73+
</a>
74+
</div>
75+
</div>
76+
77+
<p class="mt-3 text-base leading-6 text-skin-base font-normal">
78+
{{ $article->excerpt() }}
79+
</p>
80+
</a>
81+
82+
<div class="flex items-center justify-between mt-6">
83+
<div class="flex items-center">
84+
<a href="{{ route('profile', $article->author->username) }}" class="flex-shrink-0">
85+
<img class="h-10 w-10 rounded-full"
86+
src="{{ $article->author->profile_photo_url }}"
87+
alt="{{ $article->author->username }}">
88+
</a>
89+
90+
<div class="ml-3 font-sans">
91+
<p class="text-sm leading-5 font-medium text-skin-inverted-muted">
92+
<a href="{{ route('profile', $article->author->username) }}" class="hover:underline">
93+
{{ $article->author->name }}
94+
</a>
95+
</p>
96+
97+
<div class="flex text-sm leading-5 text-skin-base">
98+
@if ($article->isPublished())
99+
<time datetime="{{ $article->submitted_at->format('Y-m-d') }}">
100+
Publié le {{ $article->submitted_at->format('j M, Y') }}
101+
</time>
102+
@else
103+
@if ($article->isAwaitingApproval())
104+
<span>
105+
En attente d'approbation
106+
</span>
107+
@else
108+
<time datetime="{{ $article->updated_at->format('Y-m-d') }}">
109+
Rédigé <time-ago time="{{ $article->updated_at->getTimestamp() }}" />
110+
</time>
111+
@endif
112+
@endif
113+
114+
<span class="mx-1">
115+
&middot;
116+
</span>
117+
118+
<span>
119+
{{ $article->readTime() }} min de lecture
120+
</span>
121+
</div>
122+
</div>
123+
</div>
124+
125+
<div class="flex items-center text-gray-500">
126+
<span class="text-xl mr-2">👏</span>
127+
{{ count($article->reactions) }}
128+
</div>
129+
</div>
130+
</div>
131+
@empty
132+
<p class="text-skin-base text-base">
133+
Vous n'avez pas encore créé d'articles.
134+
</p>
135+
@endforelse
136+
137+
{{ $articles->links() }}
138+
</div>
24139
</main>
25140
</section>
26141

0 commit comments

Comments
 (0)