[Chat] Restore back button to settings screens (#10602)

src/components/Layout/Header/index.tsx

@@ -48,7 +48,7 @@ export function Outer({
   const {gtMobile} = useBreakpoints()
   const {isWithinOffsetView} = useContext(ScrollbarOffsetContext)
   const {centerColumnOffset} = useLayoutBreakpoints()
-  const {isWithinSplitView} = useIsWithinSplitView()
+  const {isWithinSplitView, isWithinLeftPanel} = useIsWithinSplitView()
 
   return (
     <View
@@ -60,7 +60,7 @@ export function Outer({
         a.align_center,
         a.gap_sm,
         sticky && web([a.sticky, {top: 0}, a.z_10, t.atoms.bg]),
-        gutters,
+        isWithinLeftPanel ? a.px_lg : gutters,
         platform({
           native: [a.pb_xs, {minHeight: 48}],
           web: [a.py_xs, {minHeight: 52}],
@@ -112,7 +112,6 @@ export function Slot({children}: {children?: React.ReactNode}) {
 export function BackButton({onPress, style, ...props}: Partial<ButtonProps>) {
   const {_} = useLingui()
   const navigation = useNavigation<NavigationProp>()
-  const {isWithinRightPanel} = useIsWithinSplitView()
 
   const onPressBack = useCallback(
     (evt: GestureResponderEvent) => {
@@ -127,10 +126,6 @@ export function BackButton({onPress, style, ...props}: Partial<ButtonProps>) {
     [onPress, navigation],
   )
 
-  if (isWithinRightPanel) {
-    return null
-  }
-
   return (
     <Slot>
       <Button
@@ -188,12 +183,14 @@ export function TitleText({
   style,
 }: {children: React.ReactNode} & TextStyleProp) {
   const {gtMobile} = useBreakpoints()
+  const {isWithinLeftPanel} = useIsWithinSplitView()
   const align = useContext(AlignmentContext)
   return (
     <Text
       style={[
-        a.text_lg,
-        a.font_semi_bold,
+        isWithinLeftPanel
+          ? [a.text_xl, a.font_bold]
+          : [a.text_lg, a.font_semi_bold],
         a.leading_tight,
         IS_IOS && align === 'platform' && a.text_center,
         gtMobile && a.text_xl,