fix prettier conflicts
This commit is contained in:
parent
eb2534ff94
commit
035ce9f1b9
5
App.tsx
5
App.tsx
@ -2,14 +2,13 @@ import React, { useEffect } from "react";
|
||||
import { ClientProvider, useAuthHeader } from "./graphql/client";
|
||||
import AppNavigator from "./navigation/app-navigator";
|
||||
|
||||
import { DEV_USER_ID } from "./config";
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import { DEV_USER_ID } from "./config";
|
||||
|
||||
// TODO: move to different file?
|
||||
const SetAuthHeaderBasedOnEnv = () => {
|
||||
const { setAuthHeader } = useAuthHeader();
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const setAuthAsync = async () => {
|
||||
if (DEV_USER_ID) {
|
||||
@ -17,7 +16,7 @@ const SetAuthHeaderBasedOnEnv = () => {
|
||||
setAuthHeader({ key: "user_id", value: DEV_USER_ID });
|
||||
} else {
|
||||
// Fetch token for authenticated users in production
|
||||
const token = await AsyncStorage.getItem('token'); // get from not firebase auth ASYNC
|
||||
const token = await AsyncStorage.getItem("token"); // get from not firebase auth ASYNC
|
||||
if (token) {
|
||||
console.log("Setting firebase auth token");
|
||||
setAuthHeader({ key: "Authorization", value: `Bearer ${token}` });
|
||||
|
@ -1,45 +1,53 @@
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||||
import auth, { FirebaseAuthTypes } from '@react-native-firebase/auth';
|
||||
import { Alert } from 'react-native';
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import auth, { FirebaseAuthTypes } from "@react-native-firebase/auth";
|
||||
import { Alert } from "react-native";
|
||||
|
||||
export const handleSignInWithPhoneNumber = async (phoneNumber: string): Promise<FirebaseAuthTypes.ConfirmationResult | undefined> => {
|
||||
if (!phoneNumber) {
|
||||
Alert.alert("Please enter a valid phone number with a country code");
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const confirmation = await auth().signInWithPhoneNumber(phoneNumber);
|
||||
return confirmation;
|
||||
} catch (err) {
|
||||
console.warn(err);
|
||||
Alert.alert("There was an error. Make sure you are using a country code (ex: +1 for US)");
|
||||
}
|
||||
export const handleSignInWithPhoneNumber = async (
|
||||
phoneNumber: string,
|
||||
): Promise<FirebaseAuthTypes.ConfirmationResult | undefined> => {
|
||||
if (!phoneNumber) {
|
||||
Alert.alert("Please enter a valid phone number with a country code");
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const confirmation = await auth().signInWithPhoneNumber(phoneNumber);
|
||||
return confirmation;
|
||||
} catch (err) {
|
||||
console.warn(err);
|
||||
Alert.alert(
|
||||
"There was an error. Make sure you are using a country code (ex: +1 for US)",
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
export const confirmCode = async (confirm: FirebaseAuthTypes.ConfirmationResult, code: string): Promise<void> => {
|
||||
try {
|
||||
await confirm.confirm(code);
|
||||
} catch {
|
||||
Alert.alert("Invalid code, please try again.");
|
||||
}
|
||||
export const confirmCode = async (
|
||||
confirm: FirebaseAuthTypes.ConfirmationResult,
|
||||
code: string,
|
||||
): Promise<void> => {
|
||||
try {
|
||||
await confirm.confirm(code);
|
||||
} catch {
|
||||
Alert.alert("Invalid code, please try again.");
|
||||
}
|
||||
};
|
||||
|
||||
// TODO: eslint not detecting ts?
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
export const onAuthStateChanged = (callback: (user: FirebaseAuthTypes.User | null) => void) => {
|
||||
return auth().onAuthStateChanged(callback);
|
||||
export const onAuthStateChanged = (
|
||||
// TODO: eslint not detecting ts?
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
callback: (user: FirebaseAuthTypes.User | null) => void,
|
||||
) => {
|
||||
return auth().onAuthStateChanged(callback);
|
||||
};
|
||||
|
||||
|
||||
export const getCurrentUserToken = async (): Promise<string | null> => {
|
||||
const user = auth().currentUser;
|
||||
if (user) {
|
||||
return await user.getIdToken();
|
||||
}
|
||||
return null;
|
||||
const user = auth().currentUser;
|
||||
if (user) {
|
||||
return await user.getIdToken();
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
export const handleSignOut = async (): Promise<void> => {
|
||||
await AsyncStorage.removeItem('token');
|
||||
await auth().signOut()
|
||||
}
|
||||
await AsyncStorage.removeItem("token");
|
||||
await auth().signOut();
|
||||
};
|
||||
|
@ -1,15 +1,15 @@
|
||||
import {
|
||||
handleSignInWithPhoneNumber,
|
||||
confirmCode,
|
||||
onAuthStateChanged,
|
||||
getCurrentUserToken,
|
||||
handleSignOut
|
||||
} from './firebase-auth'
|
||||
confirmCode,
|
||||
getCurrentUserToken,
|
||||
handleSignInWithPhoneNumber,
|
||||
handleSignOut,
|
||||
onAuthStateChanged,
|
||||
} from "./firebase-auth";
|
||||
|
||||
export {
|
||||
handleSignInWithPhoneNumber,
|
||||
confirmCode,
|
||||
onAuthStateChanged,
|
||||
getCurrentUserToken,
|
||||
handleSignOut
|
||||
}
|
||||
confirmCode,
|
||||
getCurrentUserToken,
|
||||
handleSignInWithPhoneNumber,
|
||||
handleSignOut,
|
||||
onAuthStateChanged,
|
||||
};
|
||||
|
@ -1,18 +1,18 @@
|
||||
import { handleSignOut } from "../../auth"
|
||||
import { useAuthHeader } from "../../graphql/client"
|
||||
import React from "react"
|
||||
import { Button } from "react-native"
|
||||
import React from "react";
|
||||
import { Button } from "react-native";
|
||||
import { handleSignOut } from "../../auth";
|
||||
import { useAuthHeader } from "../../graphql/client";
|
||||
|
||||
export default function SignOutButton(): React.JSX.Element {
|
||||
const { setAuthHeader } = useAuthHeader()
|
||||
const { setAuthHeader } = useAuthHeader();
|
||||
|
||||
return (
|
||||
<Button
|
||||
title={'Sign out'}
|
||||
onPress={async () => {
|
||||
setAuthHeader({ key: 'Authorization', value: '' })
|
||||
await handleSignOut()
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Button
|
||||
title={"Sign out"}
|
||||
onPress={async () => {
|
||||
setAuthHeader({ key: "Authorization", value: "" });
|
||||
await handleSignOut();
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
15
config.ts
15
config.ts
@ -1,20 +1,17 @@
|
||||
const warnEnv = [
|
||||
'EXPO_PUBLIC_API_URI'
|
||||
];
|
||||
const warnEnv = ["EXPO_PUBLIC_API_URI"];
|
||||
|
||||
const errMsg =
|
||||
'does not exist in the environment.';
|
||||
const errMsg = "does not exist in the environment.";
|
||||
|
||||
const missingEnv: string[] = [];
|
||||
|
||||
for (const key of warnEnv) {
|
||||
if (!process.env[key]) {
|
||||
missingEnv.push(key);
|
||||
}
|
||||
if (!process.env[key]) {
|
||||
missingEnv.push(key);
|
||||
}
|
||||
}
|
||||
|
||||
if (missingEnv.length > 0) {
|
||||
throw new Error(`${missingEnv.join(', ')} ${errMsg}`);
|
||||
throw new Error(`${missingEnv.join(", ")} ${errMsg}`);
|
||||
}
|
||||
|
||||
export const API_URI = process.env.EXPO_PUBLIC_API_URI;
|
||||
|
@ -1,7 +1,7 @@
|
||||
// eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
|
||||
declare namespace NodeJS {
|
||||
interface ProcessEnv {
|
||||
EXPO_PUBLIC_API_URI: string;
|
||||
interface ProcessEnv {
|
||||
EXPO_PUBLIC_API_URI: string;
|
||||
EXPO_PUBLIC_DEV_USER_ID?: string;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -15,7 +15,7 @@ import React, {
|
||||
useState,
|
||||
} from "react";
|
||||
|
||||
import { API_URI } from '../config'
|
||||
import { API_URI } from "../config";
|
||||
|
||||
type Props = {
|
||||
children: ReactNode;
|
||||
@ -23,11 +23,11 @@ type Props = {
|
||||
|
||||
export const AuthHeaderContext = createContext<
|
||||
| {
|
||||
authHeader: { key: string; value: string };
|
||||
setAuthHeader: React.Dispatch<
|
||||
React.SetStateAction<{ key: string; value: string }>
|
||||
>;
|
||||
}
|
||||
authHeader: { key: string; value: string };
|
||||
setAuthHeader: React.Dispatch<
|
||||
React.SetStateAction<{ key: string; value: string }>
|
||||
>;
|
||||
}
|
||||
| undefined
|
||||
>(undefined);
|
||||
|
||||
|
@ -88,4 +88,4 @@
|
||||
"@babel/core": "^7.20.2",
|
||||
"babel-loader": "^8.3.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,5 +1,7 @@
|
||||
// Login.tsx
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import { FirebaseAuthTypes } from "@react-native-firebase/auth";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Keyboard,
|
||||
@ -7,27 +9,30 @@ import {
|
||||
TextInput,
|
||||
TouchableWithoutFeedback,
|
||||
View,
|
||||
} from 'react-native';
|
||||
import { handleSignInWithPhoneNumber, confirmCode, onAuthStateChanged } from '../auth';
|
||||
import { FirebaseAuthTypes } from '@react-native-firebase/auth';
|
||||
import { useAuthHeader } from '../graphql/client';
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||||
import SignOutButton from '../component/buttons/sign-out';
|
||||
} from "react-native";
|
||||
import {
|
||||
confirmCode,
|
||||
handleSignInWithPhoneNumber,
|
||||
onAuthStateChanged,
|
||||
} from "../auth";
|
||||
import SignOutButton from "../component/buttons/sign-out";
|
||||
import { useAuthHeader } from "../graphql/client";
|
||||
|
||||
export default function Login() {
|
||||
const [phoneNumber, setPhoneNumber] = useState<string>('');
|
||||
const [code, setCode] = useState<string>('');
|
||||
const [phoneNumber, setPhoneNumber] = useState<string>("");
|
||||
const [code, setCode] = useState<string>("");
|
||||
const [user, setUser] = useState<FirebaseAuthTypes.User | null>(null);
|
||||
const [confirm, setConfirm] = useState<FirebaseAuthTypes.ConfirmationResult | null>(null);
|
||||
const { authHeader, setAuthHeader } = useAuthHeader()
|
||||
const [confirm, setConfirm] =
|
||||
useState<FirebaseAuthTypes.ConfirmationResult | null>(null);
|
||||
const { authHeader, setAuthHeader } = useAuthHeader();
|
||||
|
||||
useEffect(() => {
|
||||
const unsubscribe = onAuthStateChanged(async (user) => {
|
||||
setUser(user)
|
||||
setUser(user);
|
||||
if (user) {
|
||||
const token = await user.getIdToken()
|
||||
const token = await user.getIdToken();
|
||||
if (token) {
|
||||
await AsyncStorage.setItem('token', token);
|
||||
await AsyncStorage.setItem("token", token);
|
||||
setAuthHeader({ key: "Authorization", value: `Bearer ${token}` });
|
||||
}
|
||||
}
|
||||
@ -36,11 +41,9 @@ export default function Login() {
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
|
||||
<View style={{ alignItems: 'center' }}>
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<TextInput
|
||||
style={{
|
||||
width: "50%",
|
||||
@ -74,10 +77,16 @@ export default function Login() {
|
||||
/>
|
||||
)}
|
||||
<Button
|
||||
title={!confirm ? 'Receive code' : 'Confirm code'}
|
||||
onPress={() => !confirm ? handleSignInWithPhoneNumber(phoneNumber).then(setConfirm) : confirm && confirmCode(confirm, code)}
|
||||
title={!confirm ? "Receive code" : "Confirm code"}
|
||||
onPress={() =>
|
||||
!confirm
|
||||
? handleSignInWithPhoneNumber(phoneNumber).then(setConfirm)
|
||||
: confirm && confirmCode(confirm, code)
|
||||
}
|
||||
/>
|
||||
<Text>{authHeader.key}: {authHeader.value}</Text>
|
||||
<Text>
|
||||
{authHeader.key}: {authHeader.value}
|
||||
</Text>
|
||||
{user && (
|
||||
<>
|
||||
<Text style={{ marginTop: 10 }}>
|
||||
|
Loading…
Reference in New Issue
Block a user