broke the Desktop view - resetting to the old view, while keeping mobile working

Signed-off-by: Kai Wagner <kai.wagner@percona.com>

Author: ImTheKai

app/assets/stylesheets/components/sidebar.css

@@ -34,6 +34,12 @@
   transform: scale(1.05);
 }
 
+@media (min-width: 901px) {
+  .sidebar-collapse-button {
+    display: none;
+  }
+}
+
 @media (max-width: 720px) {
   .layout-sidebar-resizer {
     width: 18px;

app/assets/stylesheets/components/topics.css

@@ -220,7 +220,7 @@ a.topic-icon {
     }
   }
 
-  .topic-title-stack {
+  .topic-title-mobile {
     display: flex;
     flex-direction: column;
     gap: var(--spacing-1);
@@ -375,8 +375,14 @@ a.topic-icon {
 }
 
 
-.topic-title-stack {
-  display: flex;
+.topic-title-main {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--spacing-2);
+}
+
+.topic-title-mobile {
+  display: none;
   flex-direction: column;
   gap: var(--spacing-2);
 }
@@ -444,6 +450,14 @@ a.topic-icon {
 }
 
 @media (max-width: 900px) {
+  .topic-title-main {
+    display: none;
+  }
+
+  .topic-title-mobile {
+    display: flex;
+  }
+
   .topic-row-footer {
     display: grid;
     grid-template-columns: var(--topic-footer-icons-width, 96px) minmax(0, 1fr) auto;

app/javascript/controllers/sidebar_controller.js

@@ -30,6 +30,10 @@ export default class extends Controller {
   }
 
   toggle() {
+    if (!this.isMobile()) {
+      return
+    }
+
     if (this.isCollapsed()) {
       this.expand()
     } else {
@@ -104,6 +108,12 @@ export default class extends Controller {
   }
 
   applyStoredState() {
+    if (!this.isMobile()) {
+      this.expand(false)
+      this.setSidebarWidth(this.clampWidth(this.readWidth()))
+      return
+    }
+
     const collapsed = window.localStorage.getItem(STORAGE_COLLAPSED_KEY) === "true"
     if (collapsed) {
       this.collapse(false)

app/views/topics/_status_cell.html.slim

@@ -2,10 +2,32 @@
 - status_class = "status-#{status}"
 - star_data = star_data || {}
 td.topic-title.status-border class=status_class id=dom_id(topic, "status_cell") data-label="Topic"
-  .topic-title-stack
+  - creator = topic.creator_display_alias
+  - last_sender = topic.last_sender_person&.default_alias
+  .topic-title-main
+    - if status.to_s == "reading"
+      - read_count = state[:read_count].to_i
+      - total_count = topic.message_count
+      - unread_count = [total_count - read_count, 0].max
+      - if unread_count.positive?
+        = link_to topic_path(topic, anchor: "first-unread"), class: "topic-icon topic-icon-reading", title: "Jump to first unread message (#{unread_count} unread)" do
+          i.fa-solid.fa-envelope
+          span.topic-icon-badge.topic-icon-badge-sup = unread_count
+      - else
+        .topic-icon.topic-icon-reading title="All messages read"
+          i.fa-solid.fa-envelope
+    = render partial: "topics/star_icon", locals: { topic: topic, star_data: star_data }
+    = render partial: "topics/note_icon", locals: { topic: topic, count: note_count.to_i }
+    = render partial: "topics/team_readers_icon", locals: { topic: topic, readers: team_readers }
+    - commitfest_summary = @commitfest_summaries&.dig(topic.id)
+    - if commitfest_summary
+      = render partial: "topics/commitfest_icon", locals: { summary: commitfest_summary }
+    - elsif topic.has_attachments?
+      .topic-icon title="Attachments"
+        i.fa-solid.fa-paperclip
+    = link_to topic.title, topic_path(topic), class: "topic-link"
+  .topic-title-mobile
     = link_to topic.title, topic_path(topic), class: "topic-link"
-    - creator = topic.creator_display_alias
-    - last_sender = topic.last_sender_person&.default_alias
     - if creator || last_sender
       .topic-byline
         - if creator