Skip to content

Latest commit

Β 

History

History
289 lines (233 loc) Β· 9 KB

File metadata and controls

289 lines (233 loc) Β· 9 KB

Security Features & Best Practices

This document outlines all the security warnings, best practices, and features that have been integrated into the Stellar Remittance Platform.

πŸ›‘οΈ Overview

The platform now includes comprehensive security warnings and best practices to help users protect their accounts and ensure safe transactions. These features are designed to prevent common security mistakes and educate users about blockchain security.

Features Added

1. Secret Key Security Warnings

Components

  • SecurityKeyWarning - Critical warning displayed before secret key is revealed
  • SecretKeyDisplay - Enhanced display component with reveal/hide functionality and copy options

Features

  • Mandatory Acknowledgment: Users must acknowledge security risks before viewing their secret key
  • Show/Hide Functionality: Secret key is masked by default and can be revealed
  • Copy Protection: Secret key can only be copied when revealed
  • Visual Warnings: Color-coded warnings (red background) to emphasize importance
  • Security Checklist: Displayed warnings include:
    • Never share secret key with anyone
    • Never paste into untrusted websites
    • Store offline in secure locations
    • Screenshot carefully
    • Anyone with this key can access all funds

Usage

<SecretKeyDisplay
  secretKey={account.secretKey}
  publicKey={account.publicKey}
/>

2. Large Transaction Warnings

Components

  • LargeTransactionWarning - Warns when transaction exceeds threshold
  • TransactionReviewCard - Shows detailed transaction review information

Features

  • Threshold-Based Detection: Warns when transaction amount > 1000 XLM (configurable)
  • Pre-Transaction Verification Checklist:
    • Recipient address is correct and verified
    • Amount is correct
    • Network (testnet/mainnet) is correct
  • Explicit Confirmation Required: Users must click "I've Verified Everything" before proceeding
  • Transaction Summary Card: Displays current balance, amount, and remaining balance

Usage

<LargeTransactionWarning
  amount={amount}
  assetCode="XLM"
  threshold={1000}
  onConfirm={() => setLargeTransactionConfirmed(true)}
/>

<TransactionReviewCard
  recipient={recipient}
  amount={amount}
  assetCode="XLM"
  balance={xlmBalance}
/>

3. Network-Specific Warnings

Components

  • NetworkWarning - Full warning banner showing network status
  • NetworkStatus - Compact network status display

Features

  • Testnet Detection: Shows blue warning for testnet usage
    • Indicates funds have no real value
    • Suitable for testing only
    • Can be reset without notice
  • Mainnet Detection: Shows green confirmation for mainnet
    • Emphasizes real funds at risk
    • Warns about permanent transactions
    • Reminds to verify network before sending
  • Offline Detection: Shows red error if network connection lost
    • Disables transactions until reconnected
    • Shows connection status

Testnet Warning

πŸ§ͺ Testnet Mode
You are using Stellar Testnet. Funds have no real value here.
This is suitable for testing and development only.

Mainnet Warning

βœ… Mainnet Connected
Connected to Stellar Mainnet. Real funds are at risk.
Always verify recipient addresses and transaction amounts carefully.

4. Security Best Practices Modal

Components

  • SecurityBestPracticesModal - Comprehensive security guide with multiple tabs

Features

  • 5 Educational Tabs:
    1. Security Overview - Core principles and framework
    2. Secret Key Management - DO's and DON'Ts for key storage
    3. Safe Transactions - Pre-transaction checklist and large transaction procedures
    4. Network Awareness - Testnet vs Mainnet differences
    5. Recovery - What to do if compromised or lost keys

Content Highlights

Security Overview
  • 4 core security principles with icons
  • Responsibility disclaimer
  • Foundational concepts
Secret Key Management
  • DO NOT list (5 critical mistakes to avoid)
  • DO list (5 best practices to follow)
  • Hardware wallet recommendations
  • Password manager suggestions
Safe Transactions
  • 6-step pre-transaction checklist
  • Large transaction verification checklist
  • Warning about urgency/scammer tactics
Network Awareness
  • Testnet characteristics (test funds, no value, can reset)
  • Mainnet characteristics (real money, permanent, extreme caution required)
  • Clear visual distinction with colors
Recovery
  • Suspected compromise procedures
  • Lost key recovery information
  • Links to Stellar documentation

Usage

const [showSecurityBestPractices, setShowSecurityBestPractices] = useState(false);

<SecurityBestPracticesModal
  isOpen={showSecurityBestPractices}
  onClose={() => setShowSecurityBestPractices(false)}
/>

5. Security Button in Header

  • "πŸ›‘οΈ Security" Button: Always visible in the header
  • One-Click Access: Users can open the best practices modal at any time
  • Persistent Access: Not modal-only; users can access during their entire session

πŸ”„ Integration in User Flow

Account Creation Flow

  1. User clicks "Create Account"
  2. Account is created successfully
  3. Security Warning Modal appears (first time only)
  4. Secret key is displayed with:
    • Acknowledgment warning banner
    • Public key display (safe to share)
    • Secret key masked by default
    • Show/Hide and Copy buttons with restrictions
    • Offline storage tips

Transaction Flow

  1. User enters recipient address
  2. User enters amount
  3. Network Warning displays (if applicable)
  4. Large Transaction Warning appears (if amount > 1000)
    • Lists verification checklist
    • Requires explicit confirmation
  5. Transaction Review Card shows summary
    • Recipient address
    • Amount
    • Current balance
    • Post-transaction balance
  6. Transaction sent after verification

βš™οΈ Configuration

Customizable Thresholds

// Large transaction threshold (default: 1000 XLM)
<LargeTransactionWarning
  amount={amount}
  threshold={1000}  // Change this value
/>

Session Storage

  • Security best practices modal shows only once per session
  • Stored in sessionStorage as "securityBestPractices_dismissed"
  • Users can still access via the Security button

🎨 Styling & Visual Design

Color Scheme

  • Red (#ef4444): Critical warnings, secret keys, mainnet real funds
  • Orange/Yellow (#f59e0b): Cautionary warnings, large transactions
  • Blue (#0284c7): Testnet, information
  • Green (#22c55e): Success, verified, online status

Accessibility

  • Clear visual hierarchy
  • High contrast for readability
  • Icons for quick visual recognition
  • Keyboard-navigable modals
  • ARIA labels where applicable

πŸ“± Responsive Design

All security components are responsive and work on:

  • Desktop browsers
  • Tablets
  • Mobile devices

Modal widths adjust with max-width and proper padding for smaller screens.

πŸ” Security Best Practices Implemented

  1. No Secret Key Re-display: Secret key only shown once after creation
  2. Masked by Default: Secret key masked with dots until revealed
  3. Copy Restrictions: Secret key copy only available when revealed
  4. Clear Warnings: Multiple reinforcement of security risks
  5. Large Transaction Verification: Explicit user confirmation required
  6. Network Confirmation: Users must verify they're on correct network
  7. User Education: Comprehensive modal with best practices
  8. Progressive Disclosure: Information presented in digestible chunks

πŸ§ͺ Testing Security Features

Test Secret Key Display

  1. Create a new account
  2. Verify security warning appears
  3. Click "I Understand the Risks"
  4. Verify secret key is masked
  5. Click "Show" to reveal
  6. Click "Copy" to copy to clipboard

Test Large Transaction Warning

  1. Check balance
  2. Enter amount > 1000
  3. Enter valid recipient
  4. Verify large transaction warning appears
  5. Verify verification checklist displays
  6. Verify button says "I've Verified Everything"
  7. Click button and attempt to send

Test Network Warnings

  1. On testnet: Verify blue testnet warning displays
  2. On mainnet: Verify green mainnet warning displays
  3. Disconnect internet: Verify offline warning displays

Test Security Best Practices Modal

  1. Click the πŸ›‘οΈ Security button
  2. Verify modal opens
  3. Navigate through all 5 tabs
  4. Verify content displays correctly
  5. Close modal

πŸ“š Additional Resources

πŸš€ Future Enhancements

Potential improvements for future versions:

  1. Two-factor authentication
  2. Hardware wallet integration
  3. Biometric authentication
  4. Transaction signing notifications
  5. Address book with trusted addresses
  6. Export encrypted key backups
  7. Multi-signature account setup
  8. Activity alerts and monitoring

Last Updated: 2026-03-27 Security Level: Production Ready