feat: integrate NFC functionality for reading and writing tags
- Added NFCManagerRepository to handle NFC operations using react-native-nfc-manager. - Implemented ReadNFCTagUseCase and WriteNFCTagUseCase for reading and writing NFC tags. - Updated app layout to include NFC reader screen. - Created WriteNFCScreen for writing NFC tags with filament data. - Enhanced HomeScreen to support NFC reading and added NFC button in FilamentDetailScreen. - Updated app.json to include react-native-nfc-manager dependency. - Added animations and user feedback for NFC operations in the UI.
This commit is contained in:
@@ -8,7 +8,17 @@ import { SafeAreaView } from 'react-native-safe-area-context';
|
||||
import { useFilamentStore } from '@store/filamentStore';
|
||||
import { usePresetStore } from '@store/presetStore';
|
||||
import { useAuthStore } from '@store/authStore';
|
||||
import { deleteFilamentUseCase } from '@infrastructure/container';
|
||||
import { deleteFilamentUseCase, nfcRepository } from '@infrastructure/container';
|
||||
import { SvgXml } from 'react-native-svg';
|
||||
|
||||
const NFC_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
||||
<g stroke="${colors.textSecondary}" stroke-width="10" fill="none">
|
||||
<path d="M 23.49 41.51 A 12 12 0 0 1 23.49 58.49"/>
|
||||
<path d="M 34.80 30.20 A 28 28 0 0 1 34.80 69.80"/>
|
||||
<path d="M 46.11 18.89 A 44 44 0 0 1 46.11 81.11"/>
|
||||
<path d="M 57.43 7.57 A 60 60 0 0 1 57.43 92.43"/>
|
||||
</g>
|
||||
</svg>`;
|
||||
import { calcFilamentPercentage } from '@domain/Filament';
|
||||
import { colors, typography, spacing, radius, getStockColor, getStockBgColor } from '@shared/theme';
|
||||
import { formatWeight } from '@shared/utils/filament';
|
||||
@@ -45,6 +55,15 @@ export default function FilamentDetailScreen(): React.ReactElement {
|
||||
const stockColor = getStockColor(pct);
|
||||
const slug = `${filament.brand.toLowerCase()}-${(filament.model ?? '').toLowerCase()}-${filament.colorHex.replace('#', '').toLowerCase()}`.replace(/\s+/g, '-');
|
||||
|
||||
async function handleWriteNFC(): Promise<void> {
|
||||
const supported = await nfcRepository.isSupported();
|
||||
if (!supported) {
|
||||
Alert.alert('NFC indisponível', 'Este dispositivo não possui suporte a NFC.');
|
||||
return;
|
||||
}
|
||||
router.push(`/(app)/filaments/${id}/write-nfc` as never);
|
||||
}
|
||||
|
||||
function handleDelete(): void {
|
||||
Alert.alert(
|
||||
'Excluir filamento',
|
||||
@@ -188,6 +207,13 @@ export default function FilamentDetailScreen(): React.ReactElement {
|
||||
<Ionicons name="qr-code-outline" size={14} color={colors.textSecondary} />
|
||||
<Text style={styles.idBtnTextSecondary}>Ver QR</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={[styles.idBtn, styles.idBtnSecondary]}
|
||||
onPress={handleWriteNFC}
|
||||
>
|
||||
<SvgXml xml={NFC_SVG} width={14} height={14} />
|
||||
<Text style={styles.idBtnTextSecondary}>Gravar NFC</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user