diff --git a/.editorconfig b/.editorconfig index cbaf2ef..0f4aae7 100644 --- a/.editorconfig +++ b/.editorconfig @@ -2,11 +2,16 @@ root = true [*.tsx] indent_style = tab +indent_size = 2 + +[*.ts] +indent_style = tab +indent_size = 2 [*.json] end_of_line = lf charset = utf-8 -indent_style = space +indent_style = tab indent_size = 2 trim_trailing_whitespace = true insert_final_newline = true diff --git a/App.tsx b/App.tsx index 614e54c..d069053 100644 --- a/App.tsx +++ b/App.tsx @@ -1,10 +1,24 @@ import React from "react"; import AppNavigator from "./navigation/app-navigator"; -import ClientProvider from "./graphql/client"; +import { ClientProvider, useAuthHeader } from "./graphql/client"; +import { DEV_USER_ID } from "@env"; + +const SetAuthHeaderBasedOnEnv = () => { + const { setAuthHeader } = useAuthHeader(); + + React.useEffect(() => { + if (DEV_USER_ID) { + setAuthHeader({ key: "user_id", value: DEV_USER_ID }); + } + }, [setAuthHeader]); + + return null; +}; const App: React.FC = () => { return ( + ); diff --git a/env.d.tsx b/env.d.tsx index 0833e83..e534b18 100644 --- a/env.d.tsx +++ b/env.d.tsx @@ -1,3 +1,4 @@ declare module "@env" { export const API_URI: string; + export const DEV_USER_ID: string; } diff --git a/graphql/client.tsx b/graphql/client.tsx index 2c503ed..21ecd34 100644 --- a/graphql/client.tsx +++ b/graphql/client.tsx @@ -1,4 +1,10 @@ -import React, { ReactNode, createContext, useContext, useState } from "react"; +import React, { + ReactNode, + createContext, + useContext, + useState, + useMemo, +} from "react"; import { ApolloClient, ApolloLink, @@ -13,31 +19,33 @@ type Props = { children: ReactNode; }; -const AuthHeaderContext = createContext(); - -export const AuthHeaderProvider = ({ children }) => { - const [authHeader, setAuthHeader] = useState({ key: "", value: "" }); - - return ( - - {children} - - ); -}; +export const AuthHeaderContext = createContext< + | { + authHeader: { key: string; value: string }; + setAuthHeader: React.Dispatch< + React.SetStateAction<{ key: string; value: string }> + >; + } + | undefined +>(undefined); // Hook to use the auth header context -export const useAuthHeader = () => useContext(AuthHeaderContext); +export const useAuthHeader = () => { + const context = useContext(AuthHeaderContext); + if (!context) { + throw new Error("useAuthHeader must be used within a ClientProvider"); + } + return context; +}; -const ClientProvider: React.FC = ({ children }) => { +export const ClientProvider: React.FC = ({ children }) => { + const [authHeader, setAuthHeader] = useState({ key: "", value: "" }); const httpLink = new HttpLink({ - uri: API_URI, + uri: API_URI || "https://api-dev.railbird.ai/graphql", }); const cache = new InMemoryCache({}); - const { authHeader } = useAuthHeader(); - const authMiddleware = new ApolloLink((operation, forward) => { - // Retrieve auth key and value from context const { key, value } = authHeader; if (key && value) { @@ -55,13 +63,16 @@ const ClientProvider: React.FC = ({ children }) => { const client = useMemo( () => new ApolloClient({ - link: from([authMiddleware, httpLink]), // Chain the middleware with the httpLink + // Chain the middleware with the httpLink + link: from([authMiddleware, httpLink]), cache: new InMemoryCache(), }), [authHeader], ); - return {children}; + return ( + + {children} + + ); }; - -export default ClientProvider; diff --git a/package.json b/package.json index 49f8301..a86edca 100644 --- a/package.json +++ b/package.json @@ -1,74 +1,75 @@ { - "name": "railbird-rn", - "version": "1.0.0", - "main": "node_modules/expo/AppEntry.js", - "scripts": { - "start": "cp .env.development .env && expo start", - "start:android": "expo start --android", - "start:ios": "expo start --ios", - "android": "expo run:android", - "ios": "expo run:ios", - "web": "expo start --web", - "lint": "eslint . --ext .js,.ts,.tsx", - "lint:fix": "eslint . --ext .ts,.tsx --fix", - "test": "jest --forceExit" - }, - "jest": { - "preset": "jest-expo", - "transformIgnorePatterns": [ - "node_modules/(?!((jest-)?react-native|@react-native(-community)?|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg|react-native-svg-charts|d3-path)/)" - ] - }, - "dependencies": { - "@apollo/client": "^3.8.8", - "@react-native-camera-roll/camera-roll": "^7.4.0", - "@react-native-firebase/app": "^18.8.0", - "@react-native-firebase/auth": "^18.8.0", - "@react-navigation/bottom-tabs": "^6.5.11", - "@react-navigation/native": "^6.1.9", - "@react-navigation/native-stack": "^6.9.17", - "@types/react": "~18.2.14", - "@typescript-eslint/eslint-plugin": "^6.17.0", - "@typescript-eslint/parser": "^6.17.0", - "babel-plugin-inline-dotenv": "^1.7.0", - "d3-path": "^3.1.0", - "d3-scale": "^1.0.6", - "eslint": "^8.56.0", - "eslint-plugin-react": "^7.33.2", - "eslint-plugin-react-hooks": "^4.6.0", - "eslint-plugin-react-native": "^4.1.0", - "expo": "~49.0.15", - "expo-build-properties": "^0.11.0", - "expo-constants": "~14.4.2", - "expo-splash-screen": "~0.20.5", - "expo-status-bar": "~1.6.0", - "graphql": "^16.8.1", - "jest": "^29.2.1", - "jest-expo": "~49.0.0", - "railbird-gql": "git+https://dev.railbird.ai/railbird/railbird-gql.git#db82f66c5d3600d90f09c813f71287e176dc078b", - "react": "18.2.0", - "react-native": "0.72.6", - "react-native-dotenv": "^3.4.9", - "react-native-dropdown-picker": "^5.4.6", - "react-native-reanimated": "^3.6.2", - "react-native-safe-area-context": "^4.8.2", - "react-native-screens": "~3.22.0", - "react-native-static-safe-area-insets": "^2.2.0", - "react-native-svg": "13.9.0", - "react-native-svg-charts": "^5.4.0", - "typescript": "^5.3.3" - }, - "devDependencies": { - "typescript": "^5.3.3", - "@babel/core": "^7.20.0", - "@react-native/metro-config": "^0.72.9", - "@testing-library/jest-native": "^5.4.3", - "@testing-library/react-native": "^12.4.3", - "@types/d3-path": "^3.0.2", - "@types/jest": "^29.5.11", - "@types/react-native-svg-charts": "^5.0.16", - "eslint-config-prettier": "^9.1.0", - "metro-react-native-babel-preset": "^0.77.0" - }, - "private": true + "name": "railbird-rn", + "version": "1.0.0", + "main": "node_modules/expo/AppEntry.js", + "scripts": { + "start": "cp .env.development .env && expo start", + "start:android": "expo start --android", + "start:ios": "expo start --ios", + "android": "expo run:android", + "ios": "expo run:ios", + "web": "expo start --web", + "lint": "eslint . --ext .js,.ts,.tsx", + "lint:fix": "eslint . --ext .ts,.tsx --fix", + "test": "jest --forceExit" + }, + "jest": { + "preset": "jest-expo", + "transformIgnorePatterns": [ + "node_modules/(?!((jest-)?react-native|@react-native(-community)?|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg|react-native-svg-charts|d3-path)/)" + ] + }, + "dependencies": { + "@apollo/client": "^3.8.8", + "@react-native-camera-roll/camera-roll": "^7.4.0", + "@react-native-firebase/app": "^18.8.0", + "@react-native-firebase/auth": "^18.8.0", + "@react-navigation/bottom-tabs": "^6.5.11", + "@react-navigation/native": "^6.1.9", + "@react-navigation/native-stack": "^6.9.17", + "@types/react": "~18.2.14", + "@typescript-eslint/eslint-plugin": "^6.17.0", + "@typescript-eslint/parser": "^6.17.0", + "babel-plugin-inline-dotenv": "^1.7.0", + "d3-path": "^3.1.0", + "d3-scale": "^1.0.6", + "eslint": "^8.56.0", + "eslint-plugin-react": "^7.33.2", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-native": "^4.1.0", + "expo": "~49.0.15", + "expo-build-properties": "^0.11.0", + "expo-constants": "~14.4.2", + "expo-splash-screen": "~0.20.5", + "expo-status-bar": "~1.6.0", + "graphql": "^16.8.1", + "jest": "^29.2.1", + "jest-expo": "~49.0.0", + "railbird-gql": "git+https://dev.railbird.ai/railbird/railbird-gql.git#db82f66c5d3600d90f09c813f71287e176dc078b", + "react": "18.2.0", + "react-native": "0.72.6", + "react-native-dotenv": "^3.4.9", + "react-native-dropdown-picker": "^5.4.6", + "react-native-reanimated": "^3.6.2", + "react-native-safe-area-context": "^4.8.2", + "react-native-screens": "~3.22.0", + "react-native-static-safe-area-insets": "^2.2.0", + "react-native-svg": "13.9.0", + "react-native-svg-charts": "^5.4.0", + "typescript": "^5.3.3" + }, + "devDependencies": { + "@babel/core": "^7.20.0", + "@react-native/metro-config": "^0.72.9", + "@testing-library/jest-native": "^5.4.3", + "@testing-library/react-native": "^12.4.3", + "@types/d3-path": "^3.0.2", + "@types/jest": "^29.5.11", + "@types/react-native-svg-charts": "^5.0.16", + "eslint-config-prettier": "^9.1.0", + "metro-react-native-babel-preset": "^0.77.0", + "prettier-plugin-organize-imports": "^3.2.4", + "typescript": "^5.3.3" + }, + "private": true }