Skip to content

Login with Telegram OTP #20

@suhailvs

Description

@suhailvs
import { useState } from 'react';
import { TextInput, Button, Text } from 'react-native-paper';

export default function TelegramLoginScreen() {
  const [phoneNumber, setPhoneNumber] = useState('');
  const [codeSent, setCodeSent] = useState(false);
  const [otp, setOtp] = useState('');

  const sendOtp = async () => {
    // Call your server API
    await fetch('https://your-server.com/api/send-telegram-otp', {
      method: 'POST',
      body: JSON.stringify({ phone: phoneNumber }),
      headers: { 'Content-Type': 'application/json' },
    });
    setCodeSent(true);
  };

  const verifyOtp = async () => {
    const response = await fetch('https://your-server.com/api/verify-telegram-otp', {
      method: 'POST',
      body: JSON.stringify({ phone: phoneNumber, code: otp }),
      headers: { 'Content-Type': 'application/json' },
    });
    const result = await response.json();
    if (result.success) {
      // Login success!
    } else {
      // Handle error
    }
  };

  return (
    <>
      {!codeSent ? (
        <>
          <TextInput
            label="Phone Number"
            value={phoneNumber}
            onChangeText={setPhoneNumber}
            keyboardType="phone-pad"
          />
          <Button onPress={sendOtp}>Send OTP</Button>
        </>
      ) : (
        <>
          <TextInput
            label="Enter OTP"
            value={otp}
            onChangeText={setOtp}
            keyboardType="numeric"
          />
          <Button onPress={verifyOtp}>Verify OTP</Button>
        </>
      )}
    </>
  );
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions