import { useEffect, useState } from 'react'
import {
View, Text, ActivityIndicator,
TouchableOpacity, Share, StyleSheet,
} from 'react-native'
import { SafeAreaView } from 'react-native-safe-area-context'
import { useLocalSearchParams, useRouter } from 'expo-router'
import { ArrowLeft, Share2 } from 'lucide-react-native'
import { WebView } from 'react-native-webview'
import { apiFetch } from '@/lib/api'
import { ENDPOINTS } from '@/lib/config'
import { C } from '@/lib/theme'
interface Note {
id: string
title: string
content: string
updatedAt: string
notebookName?: string
}
// Le markdown est parsé côté WebView (JS natif) — évite tout problème Metro bundler
function buildHtml(content: string, title: string) {
// On passe le contenu comme JSON pour éviter les problèmes d'échappement
const safeContent = JSON.stringify(content)
const safeTitle = JSON.stringify(title || 'Sans titre')
return `
`
}
export default function NoteScreen() {
const { id } = useLocalSearchParams<{ id: string }>()
const [note, setNote] = useState(null)
const [loading, setLoading] = useState(true)
const router = useRouter()
useEffect(() => {
apiFetch(ENDPOINTS.note(id))
.then((r) => r.json())
.then((data) => setNote(data.note ?? null))
.finally(() => setLoading(false))
}, [id])
const handleShare = async () => {
if (!note) return
await Share.share({ title: note.title, message: `${note.title}\nhttps://memento-note.com` })
}
return (
router.back()} style={s.backBtn}>
{note?.title ?? '…'}
{loading
?
: note
?
: Note introuvable.}
)
}
const s = StyleSheet.create({
safe: { flex: 1, backgroundColor: C.paper },
header: { flexDirection: 'row', alignItems: 'center', gap: 12, paddingHorizontal: 16, paddingVertical: 12, borderBottomWidth: 1, borderBottomColor: C.border },
backBtn: { padding: 4 },
headerTitle: { flex: 1, fontSize: 15, fontWeight: '600', color: C.ink },
shareBtn: { padding: 4 },
center: { flex: 1, alignItems: 'center', justifyContent: 'center' },
})