UI: шапка channel owner/name и унификация карточек треда

shine-UI/js/pages/channel-view.js

@@ -766,36 +766,11 @@ function renderPostCard(post, {
 }
 
 function renderBody(screen, navigate, routeKey, channelData, handlers) {
-  const head = document.createElement('div');
-  head.className = 'card channel-head-card';
-
-  const title = document.createElement('strong');
-  title.className = 'channel-head-title';
-  title.textContent = String(channelData.channel.name || '').trim();
-
-  const owner = document.createElement('p');
-  owner.className = 'channel-head-meta';
-  owner.textContent = `Владелец: ${channelData.channel.ownerName}`;
-
-  const headActions = document.createElement('div');
-  headActions.className = 'channel-head-actions';
-  const aboutButton = document.createElement('button');
-  aboutButton.type = 'button';
-  aboutButton.className = 'secondary-btn small-btn';
-  aboutButton.textContent = 'О канале';
-  aboutButton.addEventListener('click', (event) => {
-    animatePress(event.currentTarget);
-    openAboutChannelModal(channelData.channel);
-  });
-  headActions.append(aboutButton);
-
-  head.append(title);
-  head.append(owner, headActions);
   if (channelData.reverseChannelMissingWarning) {
     const reverseWarning = document.createElement('p');
     reverseWarning.className = 'channel-head-meta';
     reverseWarning.textContent = channelData.reverseChannelMissingWarning;
-    head.append(reverseWarning);
+    screen.append(reverseWarning);
   }
 
   const actionButton = document.createElement('button');
@@ -850,9 +825,9 @@ function renderBody(screen, navigate, routeKey, channelData, handlers) {
   backButton.addEventListener('click', () => navigate('channels-list'));
 
   if (channelData.isOwnChannel || !channelData.isSubscribed) {
-    screen.append(head, actionButton, feed, backButton);
+    screen.append(actionButton, feed, backButton);
   } else {
-    screen.append(head, feed, backButton);
+    screen.append(feed, backButton);
   }
 
   applyPendingScroll(screen, routeKey);
@@ -893,6 +868,17 @@ export function render({ navigate, route }) {
     statusBox.style.display = '';
   };
 
+  const header = renderHeader({
+    title: '',
+    leftAction: { label: '<', onClick: () => navigateBack() },
+    rightActions: [{ label: 'Канал', onClick: () => {} }],
+  });
+  const channelHeaderButton = header.querySelector('.header-actions .icon-btn');
+  if (channelHeaderButton) {
+    channelHeaderButton.classList.add('channel-header-route-btn');
+    channelHeaderButton.disabled = true;
+  }
+
   const rerender = () => {
     const current = document.querySelector('section.channels-screen--channel');
     if (!current) return;
@@ -990,12 +976,7 @@ export function render({ navigate, route }) {
     rerender();
   };
 
-  screen.append(
-    renderHeader({
-      title: '',
-      leftAction: { label: '<', onClick: () => navigateBack() },
-    }),
-  );
+  screen.append(header);
   screen.append(statusBox);
 
   const skeleton = renderSkeleton(screen);
@@ -1006,6 +987,15 @@ export function render({ navigate, route }) {
     try {
       const apiData = await loadFromApi(route, channelId);
       activeSelector = apiData?.selector || null;
+      const channelRouteLabel = `${apiData?.channel?.ownerName || 'owner'}/${apiData?.channel?.name || 'channel'}`;
+      if (channelHeaderButton) {
+        channelHeaderButton.textContent = channelRouteLabel;
+        channelHeaderButton.disabled = false;
+        channelHeaderButton.onclick = (event) => {
+          animatePress(event.currentTarget);
+          openAboutChannelModal(apiData.channel);
+        };
+      }
       skeleton.remove();
       cleanupSeenTracking = renderBody(screen, navigate, routeKey, apiData, {
         onToggleLike: async (messageRef, action) => {