change js/tsx to jsx

app/location/[id].jsx

@@ -0,0 +1,62 @@
+import { View, ScrollView, StyleSheet } from 'react-native';
+import { Text, Card } from 'react-native-paper';
+import { useLocalSearchParams } from 'expo-router';
+import useLocationStore from '@/store';
+
+export default function Location() {
+  const { id } = useLocalSearchParams();
+  const location = useLocationStore((state) =>
+    state.locations.find((loc) => loc.id == id)
+  );
+
+  if (!location) {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.text}>Brak lokalizacji - {id}</Text>
+      </View>
+    );
+  }
+
+  return (
+    <View style={styles.container}>
+      <ScrollView>
+        <Card style={{ margin: 10 }}>
+          <Card.Cover style={{ marginBottom: 10 }} source={{ uri: location.image }} />
+          <Card.Content style={{ marginBottom: 10 }}>
+            <Text variant="headlineLarge" style={{ marginBottom: 10 }}>
+              {location.name}
+            </Text>
+            <Text variant="headlineLarge" style={{ marginBottom: 10 }}>
+              Opis:
+            </Text>
+            <Text variant="bodyMedium">{location.description}</Text>
+          </Card.Content>
+
+          <Card.Content>
+            <Text variant="headlineLarge" style={{ marginBottom: 10 }}>
+              Statystyki:
+            </Text>
+            <Text variant="bodyMedium" style={{ marginBottom: 10 }}>
+              Powierzchnia: {location.area} km²
+            </Text>
+            <Text variant="bodyMedium" style={{ marginBottom: 10 }}>
+              Ludność: {location.population} osób
+            </Text>
+          </Card.Content>
+        </Card>
+      </ScrollView>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#25292e',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  text: {
+    color: '#fff',
+  },
+});