fix(mobile): migrate to Expo SDK 54, replace NativeWind with StyleSheet
Some checks failed
CI / Lint, Unit Tests & Build (push) Failing after 1m5s
CI / Deploy production (on server) (push) Has been skipped

- Update package.json to Expo ~54.0.35, expo-router ~6.0.24, RN 0.81.5
- Remove NativeWind/Tailwind dependencies
- Fix babel.config.js: presets babel-preset-expo only
- Rewrite all screens with StyleSheet.create (no className)
- Add lucide-react-native + react-native-svg
- Export design tokens C from _layout.tsx for shared usage
- Install node_modules (702 packages)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
Antigravity
2026-05-29 16:18:44 +00:00
parent 9ba30b8644
commit 7c8695cacf
12 changed files with 1243 additions and 2449 deletions

View File

@@ -1,7 +1,7 @@
import { useEffect, useState } from 'react'
import {
View, Text, ScrollView, ActivityIndicator,
TouchableOpacity, Share,
View, Text, ActivityIndicator,
TouchableOpacity, Share, StyleSheet,
} from 'react-native'
import { SafeAreaView } from 'react-native-safe-area-context'
import { useLocalSearchParams, useRouter } from 'expo-router'
@@ -9,6 +9,7 @@ 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 '../_layout'
interface Note {
id: string
@@ -18,7 +19,6 @@ interface Note {
notebookName?: string
}
// Wrap HTML content in a minimal styled page for WebView rendering
function buildHtml(content: string, title: string) {
return `<!DOCTYPE html>
<html>
@@ -62,43 +62,35 @@ export default function NoteScreen() {
const handleShare = async () => {
if (!note) return
await Share.share({
title: note.title,
message: `${note.title}\nhttps://memento-note.com`,
})
await Share.share({ title: note.title, message: `${note.title}\nhttps://memento-note.com` })
}
return (
<SafeAreaView className="flex-1 bg-paper">
{/* Header */}
<View className="flex-row items-center gap-3 px-4 py-3 border-b border-border">
<TouchableOpacity onPress={() => router.back()} className="p-1">
<ArrowLeft size={22} color="#1A1A18" />
<SafeAreaView style={s.safe}>
<View style={s.header}>
<TouchableOpacity onPress={() => router.back()} style={s.backBtn}>
<ArrowLeft size={22} color={C.ink} />
</TouchableOpacity>
<Text className="flex-1 text-[15px] font-semibold text-ink" numberOfLines={1}>
{note?.title ?? '…'}
</Text>
<TouchableOpacity onPress={handleShare} className="p-1">
<Share2 size={18} color="#8A8A82" />
<Text style={s.headerTitle} numberOfLines={1}>{note?.title ?? '…'}</Text>
<TouchableOpacity onPress={handleShare} style={s.shareBtn}>
<Share2 size={18} color={C.concrete} />
</TouchableOpacity>
</View>
{loading ? (
<View className="flex-1 items-center justify-center">
<ActivityIndicator color="#A47148" size="large" />
</View>
) : note ? (
<WebView
source={{ html: buildHtml(note.content, note.title) }}
style={{ flex: 1, backgroundColor: '#FAFAF8' }}
scrollEnabled
showsVerticalScrollIndicator={false}
/>
) : (
<View className="flex-1 items-center justify-center">
<Text className="text-concrete">Note introuvable.</Text>
</View>
)}
{loading
? <View style={s.center}><ActivityIndicator color={C.brand} size="large" /></View>
: note
? <WebView source={{ html: buildHtml(note.content, note.title) }} style={{ flex: 1, backgroundColor: C.paper }} scrollEnabled showsVerticalScrollIndicator={false} />
: <View style={s.center}><Text style={{ color: C.concrete }}>Note introuvable.</Text></View>}
</SafeAreaView>
)
}
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' },
})