dchain/client-app/app/(auth)/import.tsx

/**
 * Import existing key — dark minimalist.
 * Два пути:
 *   1. Paste JSON напрямую в textarea.
 *   2. Pick файл .json через DocumentPicker.
 */
import React, { useState } from 'react';
import {
  View, Text, ScrollView, TextInput, Alert, Pressable, ActivityIndicator,
} from 'react-native';
import { router } from 'expo-router';
import { Ionicons } from '@expo/vector-icons';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import * as DocumentPicker from 'expo-document-picker';
import * as Clipboard from 'expo-clipboard';
import { saveKeyFile } from '@/lib/storage';
import { useStore } from '@/lib/store';
import { safeBack } from '@/lib/utils';
import type { KeyFile } from '@/lib/types';

import { Header } from '@/components/Header';
import { IconButton } from '@/components/IconButton';

type Tab = 'paste' | 'file';

const REQUIRED_FIELDS: (keyof KeyFile)[] = ['pub_key', 'priv_key', 'x25519_pub', 'x25519_priv'];

function validateKeyFile(raw: string): KeyFile {
  let parsed: any;
  try { parsed = JSON.parse(raw.trim()); }
  catch { throw new Error('Invalid JSON — check that you copied the full key file.'); }
  for (const field of REQUIRED_FIELDS) {
    if (!parsed[field] || typeof parsed[field] !== 'string') {
      throw new Error(`Missing or invalid field: "${field}"`);
    }
    if (!/^[0-9a-f]+$/i.test(parsed[field])) {
      throw new Error(`Field "${field}" must be a hex string.`);
    }
  }
  return parsed as KeyFile;
}

export default function ImportKeyScreen() {
  const insets     = useSafeAreaInsets();
  const setKeyFile = useStore(s => s.setKeyFile);

  const [tab,      setTab]      = useState<Tab>('paste');
  const [jsonText, setJsonText] = useState('');
  const [fileName, setFileName] = useState<string | null>(null);
  const [loading,  setLoading]  = useState(false);
  const [error,    setError]    = useState<string | null>(null);

  async function applyKey(kf: KeyFile) {
    setLoading(true); setError(null);
    try {
      await saveKeyFile(kf);
      setKeyFile(kf);
      router.replace('/(app)/chats' as never);
    } catch (e: any) {
      setError(e?.message ?? 'Import failed');
    } finally {
      setLoading(false);
    }
  }

  async function handlePasteImport() {
    setError(null);
    const text = jsonText.trim();
    if (!text) {
      const clip = await Clipboard.getStringAsync();
      if (clip) setJsonText(clip);
      return;
    }
    try { await applyKey(validateKeyFile(text)); }
    catch (e: any) { setError(e?.message ?? 'Import failed'); }
  }

  async function pickFile() {
    setError(null);
    try {
      const result = await DocumentPicker.getDocumentAsync({
        type: ['application/json', 'text/plain', '*/*'],
        copyToCacheDirectory: true,
      });
      if (result.canceled) return;
      const asset = result.assets[0];
      setFileName(asset.name);
      const response = await fetch(asset.uri);
      const raw = await response.text();
      await applyKey(validateKeyFile(raw));
    } catch (e: any) {
      setError(e?.message ?? 'Import failed');
    }
  }

  return (
    <View style={{ flex: 1, backgroundColor: '#000000', paddingTop: insets.top }}>
      <Header
        title="Import key"
        left={<IconButton icon="chevron-back" size={36} onPress={() => safeBack('/')} />}
      />
      <ScrollView
        contentContainerStyle={{ padding: 14, paddingBottom: 40 }}
        keyboardShouldPersistTaps="handled"
        keyboardDismissMode="on-drag"
      >
        <Text style={{ color: '#8b8b8b', fontSize: 13, lineHeight: 19, marginBottom: 14 }}>
          Restore your account from a previously exported{' '}
          <Text style={{ color: '#ffffff', fontWeight: '600' }}>dchain_key.json</Text>.
        </Text>

        {/* Tabs */}
        <View
          style={{
            flexDirection: 'row',
            padding: 4,
            borderRadius: 999,
            backgroundColor: '#0a0a0a',
            borderWidth: 1, borderColor: '#1f1f1f',
            marginBottom: 14,
          }}
        >
          {(['paste', 'file'] as Tab[]).map(t => (
            <Pressable
              key={t}
              onPress={() => setTab(t)}
              style={{
                flex: 1,
                alignItems: 'center',
                paddingVertical: 8,
                borderRadius: 999,
                backgroundColor: tab === t ? '#1d9bf0' : 'transparent',
              }}
            >
              <Text
                style={{
                  color: tab === t ? '#ffffff' : '#8b8b8b',
                  fontWeight: '700', fontSize: 13,
                }}
              >
                {t === 'paste' ? 'Paste JSON' : 'Pick file'}
              </Text>
            </Pressable>
          ))}
        </View>

        {tab === 'paste' ? (
          <>
            <TextInput
              value={jsonText}
              onChangeText={setJsonText}
              placeholder='{"pub_key":"…","priv_key":"…","x25519_pub":"…","x25519_priv":"…"}'
              placeholderTextColor="#5a5a5a"
              multiline
              autoCapitalize="none"
              autoCorrect={false}
              style={{
                color: '#ffffff',
                fontSize: 12,
                fontFamily: 'monospace',
                backgroundColor: '#0a0a0a',
                borderRadius: 12,
                padding: 12,
                minHeight: 180,
                textAlignVertical: 'top',
                borderWidth: 1, borderColor: '#1f1f1f',
              }}
            />
            <Pressable
              onPress={handlePasteImport}
              disabled={loading}
              style={({ pressed }) => ({
                flexDirection: 'row', alignItems: 'center', justifyContent: 'center',
                paddingVertical: 12, borderRadius: 999, marginTop: 12,
                backgroundColor: loading ? '#1a1a1a' : pressed ? '#1a8cd8' : '#1d9bf0',
              })}
            >
              {loading ? (
                <ActivityIndicator color="#ffffff" size="small" />
              ) : (
                <Text style={{ color: '#ffffff', fontWeight: '700', fontSize: 14 }}>
                  {jsonText.trim() ? 'Import key' : 'Paste from clipboard'}
                </Text>
              )}
            </Pressable>
          </>
        ) : (
          <>
            <Pressable
              onPress={pickFile}
              disabled={loading}
              style={({ pressed }) => ({
                alignItems: 'center', justifyContent: 'center',
                paddingVertical: 40, borderRadius: 14,
                backgroundColor: pressed ? '#111111' : '#0a0a0a',
                borderWidth: 1, borderStyle: 'dashed', borderColor: '#1f1f1f',
              })}
            >
              <Ionicons name="document-outline" size={32} color="#8b8b8b" />
              <Text style={{ color: '#ffffff', fontSize: 14, fontWeight: '700', marginTop: 10 }}>
                {fileName ?? 'Tap to pick key.json'}
              </Text>
              <Text style={{ color: '#8b8b8b', fontSize: 12, marginTop: 4 }}>
                Will auto-import on selection
              </Text>
            </Pressable>
            {loading && (
              <View style={{ alignItems: 'center', marginTop: 12 }}>
                <ActivityIndicator color="#1d9bf0" />
              </View>
            )}
          </>
        )}

        {error && (
          <View
            style={{
              marginTop: 14,
              padding: 12,
              borderRadius: 10,
              backgroundColor: 'rgba(244,33,46,0.08)',
              borderWidth: 1, borderColor: 'rgba(244,33,46,0.25)',
            }}
          >
            <Text style={{ color: '#f4212e', fontSize: 13 }}>{error}</Text>
          </View>
        )}
      </ScrollView>
    </View>
  );
}