import { Stack, useLocalSearchParams } from "expo-router";
import { StyleSheet, Text, View } from "react-native";

export default function ChatConversationRoute() {
  const params = useLocalSearchParams<{ conversationId?: string; title?: string }>();

  return (
    <View style={styles.screen}>
      <Stack.Screen options={{ title: params.title || "会话" }} />
      <View style={styles.card}>
        <Text selectable style={styles.title}>
          聊天页骨架
        </Text>
        <Text selectable style={styles.subTitle}>
          会话 ID: {params.conversationId || "-"}
        </Text>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  screen: {
    alignItems: "center",
    backgroundColor: "#F7F7F8",
    flex: 1,
    justifyContent: "center",
    paddingHorizontal: 20,
  },
  card: {
    backgroundColor: "#FFFFFF",
    borderCurve: "continuous",
    borderRadius: 20,
    gap: 8,
    paddingHorizontal: 18,
    paddingVertical: 16,
    width: "100%",
  },
  title: {
    color: "#1F2328",
    fontSize: 18,
    fontWeight: "700",
  },
  subTitle: {
    color: "#6C737F",
    fontSize: 14,
  },
});