@dhiraj0720/report1chart 2.3.2 → 2.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dhiraj0720/report1chart",
-  "version": "2.3.2",
+  "version": "2.5.0",
   "main": "src/index.jsx",
   "scripts": {
     "test": "echo 'No tests'"

package/src/components/SafeScreen.jsx

@@ -23,7 +23,7 @@ const styles = StyleSheet.create({
   },
   container: {
     flex: 1,
-    paddingBottom: Platform.OS === 'android' ? 24 : 0,
-    paddingTop: Platform.OS === 'android' ? 24 : 0,
+    paddingBottom: Platform.OS === 'android' ? 50 : 0,
+    paddingTop: Platform.OS === 'android' ? 30 : 0,
   },
 });

package/src/index.jsx

@@ -6,7 +6,7 @@ import Report1Screen from './screens/Report1Screen';
 import Report2Screen from './screens/Report2Screen';
 import Report3Screen from './screens/Report3Screen';
 
-const AnalyticsReports = ({ config }) => {
+const AnalyticsReports = ({ config, onExit }) => {
   const [active, setActive] = useState(null);
   const [loading, setLoading] = useState(true);
 
@@ -38,7 +38,7 @@ const AnalyticsReports = ({ config }) => {
   if (!active) {
   return (
     <SafeScreen>
-      <ReportListScreen onSelect={setActive} />
+      <ReportListScreen onSelect={setActive} onExit={onExit}/>
     </SafeScreen>
   );
 }

package/src/screens/ReportListScreen.jsx

@@ -1,15 +1,102 @@
 import React from 'react';
-import { View } from 'react-native';
-import ReportCard from '../components/ReportCard';
+import {
+  View,
+  Text,
+  TouchableOpacity,
+  StyleSheet,
+} from 'react-native';
 
-const ReportListScreen = ({ onSelect }) => {
+const ReportListScreen = ({ onSelect, onExit }) => {
   return (
-    <View style={{ padding: 16 }}>
-      <ReportCard title="Report 1" onPress={() => onSelect(1)} />
-      <ReportCard title="Report 2" onPress={() => onSelect(2)} />
-      <ReportCard title="Report 3" onPress={() => onSelect(3)} />
+    <View style={styles.container}>
+      {/* HEADER */}
+      <View style={styles.header}>
+        <TouchableOpacity onPress={onExit}>
+          <Text style={styles.back}>‹</Text>
+        </TouchableOpacity>
+        <Text style={styles.title}>Analytics Reports</Text>
+        <View style={{ width: 24 }} />
+      </View>
+
+      {/* CARDS */}
+      <TouchableOpacity
+        style={styles.card}
+        onPress={() => onSelect(1)}
+      >
+        <Text style={styles.cardTitle}>Report 1</Text>
+        <Text style={styles.cardDesc}>
+          Performans Raporu (USD)
+        </Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={styles.card}
+        onPress={() => onSelect(2)}
+      >
+        <Text style={styles.cardTitle}>Report 2</Text>
+        <Text style={styles.cardDesc}>
+          Gross Profit by Company & Division
+        </Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={styles.card}
+        onPress={() => onSelect(3)}
+      >
+        <Text style={styles.cardTitle}>Report 3</Text>
+        <Text style={styles.cardDesc}>
+          Transportation Business Analysis
+        </Text>
+      </TouchableOpacity>
     </View>
   );
 };
 
 export default ReportListScreen;
+
+const styles = StyleSheet.create({
+  container: {
+    padding: 16,
+    flex: 1,
+    backgroundColor: '#f4f6f8',
+  },
+
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 20,
+  },
+
+  back: {
+    fontSize: 26,
+    fontWeight: '700',
+  },
+
+  title: {
+    flex: 1,
+    textAlign: 'center',
+    fontSize: 18,
+    fontWeight: '700',
+  },
+
+  card: {
+    backgroundColor: '#fff',
+    padding: 18,
+    borderRadius: 14,
+    marginBottom: 14,
+    borderWidth: 1,
+    borderColor: '#e0e0e0',
+    elevation: 2,
+  },
+
+  cardTitle: {
+    fontSize: 16,
+    fontWeight: '700',
+    marginBottom: 6,
+  },
+
+  cardDesc: {
+    fontSize: 13,
+    color: '#555',
+  },
+});