Fix data app page style (#25881)

* Remove info sidebar for data app pages

* Fix "Last edited by" text behavior

frontend/src/metabase/dashboard/components/DashboardHeader.styled.tsx

@@ -74,6 +74,7 @@ export const HeaderLastEditInfoLabel = styled(LastEditInfoLabel)`
 
 interface HeaderContentProps {
   showSubHeader: boolean;
+  hasSubHeader: boolean;
 }
 
 export const HeaderContent = styled.div<HeaderContentProps>`
@@ -86,8 +87,8 @@ export const HeaderContent = styled.div<HeaderContentProps>`
     opacity: ${props => (props.showSubHeader ? "1x" : "0")};
   }
 
-  ${({ showSubHeader }) =>
-    showSubHeader &&
+  ${({ hasSubHeader }) =>
+    hasSubHeader &&
     css`
       &:hover,
       &:focus-within {

frontend/src/metabase/dashboard/components/DashboardHeader.tsx

@@ -137,7 +137,7 @@ const DashboardHeader = ({
         className={cx("QueryBuilder-section", headerClassName)}
         ref={header}
       >
-        <HeaderContent showSubHeader={!isDataApp && showSubHeader}>
+        <HeaderContent hasSubHeader={!isDataApp} showSubHeader={showSubHeader}>
           <HeaderCaptionContainer>
             <HeaderCaption
               key={dashboard.name}

frontend/src/metabase/dashboard/containers/DashboardHeader.jsx

@@ -34,10 +34,13 @@ import {
 } from "./DashboardHeader.styled";
 
 const mapStateToProps = (state, props) => {
+  const isDataApp = props.dashboard.is_app_page;
+  const isShowingDashboardInfoSidebar =
+    !isDataApp && getIsShowDashboardInfoSidebar(state);
   return {
     isBookmarked: getIsBookmarked(state, props),
     isNavBarOpen: getIsNavbarOpen(state),
-    isShowingDashboardInfoSidebar: getIsShowDashboardInfoSidebar(state),
+    isShowingDashboardInfoSidebar,
   };
 };
 
@@ -196,6 +199,7 @@ class DashboardHeader extends Component {
       closeSidebar,
     } = this.props;
 
+    const isDataAppPage = dashboard.is_app_page;
     const canEdit = dashboard.can_write && isEditable && !!dashboard;
 
     const buttons = [];
@@ -361,24 +365,26 @@ class DashboardHeader extends Component {
             onDeleteBookmark={deleteBookmark}
             isBookmarked={isBookmarked}
           />,
-          <Tooltip key="dashboard-info-button" tooltip={t`More info`}>
-            <DashboardHeaderButton
-              icon="info"
-              isActive={isShowingDashboardInfoSidebar}
-              onClick={() =>
-                isShowingDashboardInfoSidebar
-                  ? closeSidebar()
-                  : setSidebar({ name: SIDEBAR_NAME.info })
-              }
-            />
-          </Tooltip>,
+          !isDataAppPage && (
+            <Tooltip key="dashboard-info-button" tooltip={t`More info`}>
+              <DashboardHeaderButton
+                icon="info"
+                isActive={isShowingDashboardInfoSidebar}
+                onClick={() =>
+                  isShowingDashboardInfoSidebar
+                    ? closeSidebar()
+                    : setSidebar({ name: SIDEBAR_NAME.info })
+                }
+              />
+            </Tooltip>
+          ),
           <EntityMenu
             key="dashboard-action-menu-button"
             items={extraButtons}
             triggerIcon="ellipsis"
             tooltip={t`Move, archive, and more...`}
           />,
-        ],
+        ].filter(Boolean),
       );
     }
 
@@ -395,6 +401,7 @@ class DashboardHeader extends Component {
       setSidebar,
     } = this.props;
 
+    const isDataAppPage = dashboard.is_app_page;
     const hasLastEditInfo = dashboard["last-edit-info"] != null;
 
     return (
@@ -405,7 +412,9 @@ class DashboardHeader extends Component {
         dashboard={dashboard}
         isEditing={isEditing}
         isBadgeVisible={!isEditing && !isFullscreen && isAdditionalInfoVisible}
-        isLastEditInfoVisible={hasLastEditInfo && isAdditionalInfoVisible}
+        isLastEditInfoVisible={
+          !isDataAppPage && hasLastEditInfo && isAdditionalInfoVisible
+        }
         isEditingInfo={isEditing}
         isNavBarOpen={this.props.isNavBarOpen}
         headerButtons={this.getHeaderButtons()}