From bb6825878bb336295f2ffcb9b42d1d45e13afbe8 Mon Sep 17 00:00:00 2001
From: drusepth <drusepth@gmail.com>
Date: Tue, 6 Dec 2022 14:12:23 -0800
Subject: [PATCH] move thredded navigation into site navigation

---
 app/assets/stylesheets/navbar.scss             |  4 ++--
 app/assets/stylesheets/thredded-overrides.scss |  9 +++++++++
 app/views/layouts/forum.html.erb               | 16 +++++++++++-----
 app/views/layouts/tailwind.html.erb            |  4 ++--
 app/views/thredded/shared/_nav.html.erb        | 18 ++++++++++--------
 .../thredded/shared/nav/_moderation.html.erb   | 11 +++++++++++
 .../nav/_notification_preferences.html.erb     |  8 ++++++++
 .../shared/nav/_private_topics.html.erb        | 12 ++++++++++++
 8 files changed, 65 insertions(+), 17 deletions(-)
 create mode 100644 app/views/thredded/shared/nav/_moderation.html.erb
 create mode 100644 app/views/thredded/shared/nav/_notification_preferences.html.erb
 create mode 100644 app/views/thredded/shared/nav/_private_topics.html.erb

diff --git a/app/assets/stylesheets/navbar.scss b/app/assets/stylesheets/navbar.scss
index 7fbc03ff..15833b7d 100644
--- a/app/assets/stylesheets/navbar.scss
+++ b/app/assets/stylesheets/navbar.scss
@@ -6,7 +6,7 @@
 	body.has-fixed-sidenav {
     padding-left: 300px !important;
 
-		nav.navbar.logged-in {
+		.notebook--sidebar.navbar.logged-in {
 			width: calc(100% - 300px);
 		}
 	}
@@ -19,7 +19,7 @@
 }
 
 @media only screen and (min-width: 601px) {
-	nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {
+	.notebook--sidebar, .notebook--sidebar .nav-wrapper i, .notebook--sidebar a.sidenav-trigger, .notebook--sidebar a.sidenav-trigger i {
 	    height: 56px;
 	    line-height: 56px;
 	}
diff --git a/app/assets/stylesheets/thredded-overrides.scss b/app/assets/stylesheets/thredded-overrides.scss
index 3599dff0..6ae9f585 100644
--- a/app/assets/stylesheets/thredded-overrides.scss
+++ b/app/assets/stylesheets/thredded-overrides.scss
@@ -11,4 +11,13 @@
 .thredded--container {
   margin: 0;
   margin-left: 3em !important;
+}
+
+@media only screen and (min-width: 601px) {
+  .thredded--nav {
+    nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {
+        height: inherit !important;
+        line-height: inherit !important;
+    }
+  }
 }
\ No newline at end of file
diff --git a/app/views/layouts/forum.html.erb b/app/views/layouts/forum.html.erb
index 413bf395..9766f9ad 100644
--- a/app/views/layouts/forum.html.erb
+++ b/app/views/layouts/forum.html.erb
@@ -146,8 +146,8 @@
 
   <!-- sidebar -->
   <!-- todo put this in shared partial with real design -->
-  <nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
-    <nav class="text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
+  <nav x-show="showSidebar" class="notebook--sidebar fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
+    <nav class="notebook--sidebar text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
       <!--
       <%= link_to main_app.table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
         <i class="material-icons text-gray-400 shrink-0 w-6 h-6 mr-2 <%= Universe.text_color %>">dashboard</i>
@@ -268,11 +268,17 @@
     </div>
   </nav>
 
-  <!-- forum navigation breadcrumbs -->
-  <nav class="bg-white border-b border-gray-200 flex" aria-label="Breadcrumb">
-    <ol role="list" class="max-w-screen-xl w-full mx-auto px-4 flex space-x-4 sm:px-6 lg:px-8">
+  <!-- forum navigation & breadcrumbs -->
+  <nav class="thredded-nav bg-white border-b border-gray-200 flex">
+    <ol role="list" class="max-w-screen-xl w-full mx-auto flex space-x-4 pl-40">
       <%= render('thredded/redesigned/breadcrumbs') %>
     </ol>
+    <ul class="divide-x">
+      <li><!-- Included to always force a left-border on whatever action is left-most --></li>
+      <%= render 'thredded/shared/nav/moderation' %>
+      <%= render 'thredded/shared/nav/notification_preferences' %>
+      <%= render 'thredded/shared/nav/private_topics' if Thredded.private_messaging_enabled %>
+    </ul>
   </nav>
 
   <!-- sidebar backdrop on mobile --> 
diff --git a/app/views/layouts/tailwind.html.erb b/app/views/layouts/tailwind.html.erb
index 1b38c1aa..eba67e67 100644
--- a/app/views/layouts/tailwind.html.erb
+++ b/app/views/layouts/tailwind.html.erb
@@ -168,8 +168,8 @@
   </header>
 
   <!-- sidebar -->
-  <nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
-    <nav class="text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
+  <nav x-show="showSidebar" class="notebook--sidebar fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
+    <nav class="notebook--sidebar text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
       <!--
       <%= link_to main_app.table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
         <i class="material-icons text-gray-400 shrink-0 w-6 h-6 mr-2 <%= Universe.text_color %>">dashboard</i>
diff --git a/app/views/thredded/shared/_nav.html.erb b/app/views/thredded/shared/_nav.html.erb
index 0a4a1a9d..d47b61f2 100644
--- a/app/views/thredded/shared/_nav.html.erb
+++ b/app/views/thredded/shared/_nav.html.erb
@@ -1,13 +1,15 @@
 <nav class="thredded--navigation -mt-8 mb-8">
-  <ul class="thredded--user-navigation<%= ' thredded--user-navigation-standalone' if Thredded.standalone_layout? %>">
-    <%= render 'thredded/shared/nav/moderation' %>
-    <%= render 'thredded/shared/nav/notification_preferences', messageboard: messageboard_or_nil %>
-    <%= render 'thredded/shared/nav/private_topics' if Thredded.private_messaging_enabled %>
-    <% if Thredded.standalone_layout? %>
+  <% if Thredded.standalone_layout? %>
+    <%#
+      I moved this list into the standalone_layout? check since we moved everything else
+      out of it and I didn't want the blank element (with borders) rendered. We can restyle
+      this if we ever go for a standalone layout and/or add more content to this again.
+    %>
+    <ul class="thredded--user-navigation<%= ' thredded--user-navigation-standalone' if Thredded.standalone_layout? %>">  
       <%= render 'thredded/shared/nav/standalone_profile' if thredded_signed_in? %>
       <%= render 'thredded/shared/nav/standalone' %>
-    <% end %>
-  </ul>
+    </ul>
+  <% end %>
   <% if content_for? :thredded_main_navigation %>
     <%= yield :thredded_main_navigation %>
   <% else %>
@@ -17,7 +19,7 @@
       <%= render 'thredded/search/form', messageboard: messageboard_or_nil %>
       <div class="thredded--spacer"></div>
       <ul class="thredded--scoped-navigation">
-        <%= render 'thredded/shared/nav/unread_topics', messageboard: messageboard_or_nil %>
+        <%# render 'thredded/shared/nav/unread_topics', messageboard: messageboard_or_nil %>
       </ul>
     </div>
   <% end %>
diff --git a/app/views/thredded/shared/nav/_moderation.html.erb b/app/views/thredded/shared/nav/_moderation.html.erb
new file mode 100644
index 00000000..33b57f19
--- /dev/null
+++ b/app/views/thredded/shared/nav/_moderation.html.erb
@@ -0,0 +1,11 @@
+<% if thredded_moderator? %>
+  <% current = current_page_moderation? %>
+  <li class="px-4 text-center m-0 thredded--user-navigation--item thredded--user-navigation--moderation<%= ' thredded--is-current' if current %>">
+    <%= link_to current ? nav_back_path : pending_moderation_path, rel: 'nofollow' do %>
+      <span class="thredded--nav-text"><%= t 'thredded.nav.moderation' %></span>
+      <% if posts_pending_moderation_count > 0 %>
+        <span class="thredded--user-navigation--moderation--pending-count"><%= posts_pending_moderation_count %></span>
+      <% end %>
+    <% end %>
+  </li>
+<% end %>
diff --git a/app/views/thredded/shared/nav/_notification_preferences.html.erb b/app/views/thredded/shared/nav/_notification_preferences.html.erb
new file mode 100644
index 00000000..e4974d6e
--- /dev/null
+++ b/app/views/thredded/shared/nav/_notification_preferences.html.erb
@@ -0,0 +1,8 @@
+<% if false  %>
+  <% current = current_page_preferences? %>
+  <li class="px-4 m-0 thredded--user-navigation--settings thredded--user-navigation--item<%= ' thredded--is-current' if current %>">
+    <%= link_to current ? nav_back_path(messageboard) : edit_preferences_path(messageboard), rel: 'nofollow' do %>
+      <span class="thredded--nav-text"><%= t('thredded.nav.settings') %></span>
+    <% end %>
+  </li>
+<% end %>
\ No newline at end of file
diff --git a/app/views/thredded/shared/nav/_private_topics.html.erb b/app/views/thredded/shared/nav/_private_topics.html.erb
new file mode 100644
index 00000000..223244b0
--- /dev/null
+++ b/app/views/thredded/shared/nav/_private_topics.html.erb
@@ -0,0 +1,12 @@
+<% current = current_page_private_topics? %>
+<li class="px-4 thredded--user-navigation--item thredded--user-navigation--private-topics<%= ' thredded--is-current' if current %>">
+  <%= link_to current ? nav_back_path : private_topics_path, rel: 'nofollow' do %>
+    <%# inline_svg_tag 'thredded/private-messages.svg',
+                       class: 'thredded--icon',
+                       title: t('thredded.nav.private_topics') %>
+    <span class="thredded--nav-text"><%= t('thredded.nav.private_topics') %></span>
+    <% if unread_private_topics_count > 0 -%>
+      <span class="thredded--user-navigation--private-topics--unread"><%= unread_private_topics_count %></span>
+    <% end -%>
+  <% end -%>
+</li>