From 675b51f5628988aece7d3ecbe2ef154645658ec2 Mon Sep 17 00:00:00 2001
From: Nick Gerleman <ngerlem@meta.com>
Date: Fri, 11 Apr 2025 17:13:19 -0700
Subject: [PATCH] Remove chonky header for single modules (#50672)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50672

We have precious little screen real estate, esp in E2E tests where we get 320x192 dips. Let's clean this up.

Changelog: [Internal]

Reviewed By: cortinico, GijsWeterings

Differential Revision: D72683491

fbshipit-source-id: 222a77f937dfb9dcceb627d8f084c58df7c07b56
---
 .../rn-tester/js/components/RNTTestDetails.js | 108 ------------------
 .../js/components/RNTesterModuleContainer.js  |   7 --
 2 files changed, 115 deletions(-)
 delete mode 100644 packages/rn-tester/js/components/RNTTestDetails.js

diff --git a/packages/rn-tester/js/components/RNTTestDetails.js b/packages/rn-tester/js/components/RNTTestDetails.js
deleted file mode 100644
index 7c3af618c63..00000000000
--- a/packages/rn-tester/js/components/RNTTestDetails.js
+++ /dev/null
@@ -1,108 +0,0 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * @format
- * @flow strict-local
- */
-
-import {type RNTesterTheme} from './RNTesterTheme';
-import * as React from 'react';
-import {Button, Platform, StyleSheet, Text, View} from 'react-native';
-
-function RNTTestDetails({
-  description,
-  expect,
-  title,
-  theme,
-}: {
-  description?: string,
-  expect?: string,
-  title: string,
-  theme: RNTesterTheme,
-}): React.Node {
-  const [collapsed, setCollapsed] = React.useState(true);
-
-  const content =
-    description == null && expect == null ? null : (
-      <>
-        {description == null ? null : (
-          <View style={styles.section}>
-            <Text style={[styles.heading, {color: theme.LabelColor}]}>
-              Description
-            </Text>
-            <Text style={[styles.paragraph, {color: theme.LabelColor}]}>
-              {description}
-            </Text>
-          </View>
-        )}
-        {expect == null ? null : (
-          <View style={styles.section}>
-            <Text style={[styles.heading, {color: theme.LabelColor}]}>
-              Expectation
-            </Text>
-            <Text style={[styles.paragraph, {color: theme.LabelColor}]}>
-              {expect}
-            </Text>
-          </View>
-        )}
-      </>
-    );
-  return (
-    <View
-      style={StyleSheet.compose(styles.container, {
-        borderColor: theme.SeparatorColor,
-        backgroundColor:
-          Platform.OS === 'ios'
-            ? theme.SystemBackgroundColor
-            : theme.BackgroundColor,
-      })}>
-      <View style={styles.titleRow}>
-        <Text
-          numberOfLines={1}
-          style={StyleSheet.compose(styles.title, {color: theme.LabelColor})}>
-          {title}
-        </Text>
-        {content != null && (
-          <Button
-            title={collapsed ? 'Expand' : 'Collapse'}
-            onPress={() => setCollapsed(!collapsed)}
-            color={theme.LinkColor}
-          />
-        )}
-      </View>
-      {!collapsed ? content : null}
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 10,
-    paddingTop: 6,
-    paddingBottom: 10,
-    borderBottomWidth: 1,
-  },
-  heading: {
-    fontSize: 16,
-    fontWeight: '500',
-  },
-  paragraph: {
-    fontSize: 14,
-  },
-  section: {
-    marginVertical: 4,
-  },
-  title: {
-    fontSize: 18,
-  },
-  titleRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-  },
-});
-
-export default RNTTestDetails;
diff --git a/packages/rn-tester/js/components/RNTesterModuleContainer.js b/packages/rn-tester/js/components/RNTesterModuleContainer.js
index 66f9a8e94cf..85f17dff0ec 100644
--- a/packages/rn-tester/js/components/RNTesterModuleContainer.js
+++ b/packages/rn-tester/js/components/RNTesterModuleContainer.js
@@ -15,7 +15,6 @@ import type {
 
 import {type RNTesterTheme, RNTesterThemeContext} from './RNTesterTheme';
 import RNTPressableRow from './RNTPressableRow';
-import RNTTestDetails from './RNTTestDetails';
 import * as React from 'react';
 import {Platform, ScrollView, StyleSheet, Text, View} from 'react-native';
 
@@ -80,12 +79,6 @@ export default function RNTesterModuleContainer(props: Props): React.Node {
 
   return singleModule != null ? (
     <>
-      <RNTTestDetails
-        title={singleModule.title}
-        description={singleModule.description}
-        expect={singleModule.expect}
-        theme={theme}
-      />
       {singleModule.scrollable === true ? (
         <ScrollView style={styles.examplesContainer} testID="example-container">
           <singleModule.render />