token passed, tested with a call, change up env a bit

.env.development

@@ -1,3 +1,3 @@
 # .env.development
-EXPO_PUBLIC_API_URI="http://192.168.1.28:8000/graphql"
+API_URI="http://192.168.1.28:8000/graphql"
-EXPO_PUBLIC_DEV_USER_ID=1
+DEV_USER_ID=1

.env.production

@@ -1,2 +1,2 @@
 # .env.production
-EXPO_PUBLIC_API_URI=https://api-dev.railbird.ai/graphql
+API_URI=https://api-dev.railbird.ai/graphql

App.tsx

@@ -3,7 +3,7 @@ import { ClientProvider, useAuthHeader } from "./graphql/client";
 import AppNavigator from "./navigation/app-navigator";
 
 import AsyncStorage from "@react-native-async-storage/async-storage";
-import { DEV_USER_ID } from "./config";
+import { DEV_USER_ID } from "@env";
 
 // TODO: move to different file?
 const SetAuthHeaderBasedOnEnv = () => {

config.ts

@@ -1,18 +0,0 @@
-const warnEnv = ["EXPO_PUBLIC_API_URI"];
-
-const errMsg = "does not exist in the environment.";
-
-const missingEnv: string[] = [];
-
-for (const key of warnEnv) {
-	if (!process.env[key]) {
-		missingEnv.push(key);
-	}
-}
-
-if (missingEnv.length > 0) {
-	throw new Error(`${missingEnv.join(", ")} ${errMsg}`);
-}
-
-export const API_URI = process.env.EXPO_PUBLIC_API_URI;
-export const DEV_USER_ID = process.env.EXPO_PUBLIC_DEV_USER_ID ?? false;

env.d.tsx

@@ -1,7 +1,4 @@
-// eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
+declare module "@env" {
-declare namespace NodeJS {
+	export const API_URI: string;
-	interface ProcessEnv {
+	export const DEV_USER_ID: string;
-		EXPO_PUBLIC_API_URI: string;
-		EXPO_PUBLIC_DEV_USER_ID?: string;
-	}
 }

graphql/client.tsx

@@ -15,7 +15,7 @@ import React, {
 	useState,
 } from "react";
 
-import { API_URI } from "../config";
+import { API_URI } from "@env";
 
 type Props = {
 	children: ReactNode;

navigation/app-navigator.tsx

@@ -14,13 +14,13 @@ const Stack = createNativeStackNavigator();
 const ScreensStack = () => (
 	<Stack.Navigator>
 		<Stack.Screen
-			name="Login"
+			name="Tabs"
-			component={Login}
+			component={Tabs}
 			options={{ headerShown: false }}
 		/>
 		<Stack.Screen
-			name="Tabs"
+			name="Login"
-			component={Tabs}
+			component={Login}
 			options={{ headerShown: false }}
 		/>
 	</Stack.Navigator>

package.json

@@ -3,7 +3,7 @@
 	"version": "1.0.0",
 	"main": "node_modules/expo/AppEntry.js",
 	"scripts": {
-		"start": "cp .env.development .env && expo start",
+		"start": "NODE_ENV=development && expo start",
 		"start:android": "expo start --android",
 		"start:ios": "expo start --ios",
 		"android": "expo run:android",

screens/login.tsx

@@ -18,7 +18,7 @@ import {
 import SignOutButton from "../component/buttons/sign-out";
 import { useAuthHeader } from "../graphql/client";
 
-export default function Login() {
+export default function Login({ navigation }) {
 	const [phoneNumber, setPhoneNumber] = useState<string>("");
 	const [code, setCode] = useState<string>("");
 	const [user, setUser] = useState<FirebaseAuthTypes.User | null>(null);
@@ -33,7 +33,7 @@ export default function Login() {
 				const token = await user.getIdToken();
 				if (token) {
 					await AsyncStorage.setItem("token", token);
-					setAuthHeader({ key: "Authorization", value: `Bearer ${token}` });
+					setAuthHeader({ key: "Authorization", value: token });
 				}
 			}
 		});
@@ -41,6 +41,8 @@ export default function Login() {
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
 
+	console.log(authHeader.value)
+
 	return (
 		<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
 			<View style={{ alignItems: "center" }}>
@@ -95,6 +97,7 @@ export default function Login() {
 						<Text>Phone number: {user?.phoneNumber}</Text>
 
 						<SignOutButton />
+						<Button color="orange" title="Go to app" onPress={() => navigation.push("Tabs")} />
 					</>
 				)}
 			</View>