Merge pull request 'ivan/add-dev-auth' (#81) from ivan/add-dev-auth into master
Reviewed-on: railbird/rn-playground#81
This commit is contained in:
commit
a6883a624a
@ -1,9 +1,17 @@
|
|||||||
root = true
|
root = true
|
||||||
|
|
||||||
|
[*.tsx]
|
||||||
|
indent_style = tab
|
||||||
|
indent_size = 2
|
||||||
|
|
||||||
|
[*.ts]
|
||||||
|
indent_style = tab
|
||||||
|
indent_size = 2
|
||||||
|
|
||||||
[*.json]
|
[*.json]
|
||||||
end_of_line = lf
|
end_of_line = lf
|
||||||
charset = utf-8
|
charset = utf-8
|
||||||
indent_style = space
|
indent_style = tab
|
||||||
indent_size = 2
|
indent_size = 2
|
||||||
trim_trailing_whitespace = true
|
trim_trailing_whitespace = true
|
||||||
insert_final_newline = true
|
insert_final_newline = true
|
||||||
|
|||||||
16
App.tsx
16
App.tsx
@ -1,10 +1,24 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import AppNavigator from "./navigation/app-navigator";
|
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 = () => {
|
const App: React.FC = () => {
|
||||||
return (
|
return (
|
||||||
<ClientProvider>
|
<ClientProvider>
|
||||||
|
<SetAuthHeaderBasedOnEnv />
|
||||||
<AppNavigator />
|
<AppNavigator />
|
||||||
</ClientProvider>
|
</ClientProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -1,3 +1,4 @@
|
|||||||
declare module "@env" {
|
declare module "@env" {
|
||||||
export const API_URI: string;
|
export const API_URI: string;
|
||||||
|
export const DEV_USER_ID: string;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,13 @@
|
|||||||
import React, { ReactNode } from "react";
|
import React, {
|
||||||
|
ReactNode,
|
||||||
|
createContext,
|
||||||
|
useContext,
|
||||||
|
useState,
|
||||||
|
useMemo,
|
||||||
|
} from "react";
|
||||||
import {
|
import {
|
||||||
ApolloClient,
|
ApolloClient,
|
||||||
|
ApolloLink,
|
||||||
InMemoryCache,
|
InMemoryCache,
|
||||||
ApolloProvider,
|
ApolloProvider,
|
||||||
HttpLink,
|
HttpLink,
|
||||||
@ -12,18 +19,60 @@ type Props = {
|
|||||||
children: ReactNode;
|
children: ReactNode;
|
||||||
};
|
};
|
||||||
|
|
||||||
const ClientProvider: React.FC<Props> = ({ 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 = () => {
|
||||||
|
const context = useContext(AuthHeaderContext);
|
||||||
|
if (!context) {
|
||||||
|
throw new Error("useAuthHeader must be used within a ClientProvider");
|
||||||
|
}
|
||||||
|
return context;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const ClientProvider: React.FC<Props> = ({ children }) => {
|
||||||
|
const [authHeader, setAuthHeader] = useState({ key: "", value: "" });
|
||||||
const httpLink = new HttpLink({
|
const httpLink = new HttpLink({
|
||||||
uri: API_URI,
|
uri: API_URI || "https://api-dev.railbird.ai/graphql",
|
||||||
});
|
});
|
||||||
const cache = new InMemoryCache({});
|
const cache = new InMemoryCache({});
|
||||||
|
|
||||||
const client = new ApolloClient({
|
const authMiddleware = new ApolloLink((operation, forward) => {
|
||||||
link: from([httpLink]),
|
const { key, value } = authHeader;
|
||||||
cache: cache,
|
|
||||||
|
if (key && value) {
|
||||||
|
operation.setContext({
|
||||||
|
headers: {
|
||||||
|
[key]: value,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return forward(operation);
|
||||||
});
|
});
|
||||||
|
|
||||||
return <ApolloProvider client={client}>{children}</ApolloProvider>;
|
// We use useMemo to avoid recreating the client on every render
|
||||||
};
|
const client = useMemo(
|
||||||
|
() =>
|
||||||
|
new ApolloClient({
|
||||||
|
// Chain the middleware with the httpLink
|
||||||
|
link: from([authMiddleware, httpLink]),
|
||||||
|
cache: new InMemoryCache(),
|
||||||
|
}),
|
||||||
|
[authHeader],
|
||||||
|
);
|
||||||
|
|
||||||
export default ClientProvider;
|
return (
|
||||||
|
<AuthHeaderContext.Provider value={{ authHeader, setAuthHeader }}>
|
||||||
|
<ApolloProvider client={client}>{children}</ApolloProvider>
|
||||||
|
</AuthHeaderContext.Provider>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|||||||
145
package.json
145
package.json
@ -1,74 +1,75 @@
|
|||||||
{
|
{
|
||||||
"name": "railbird-rn",
|
"name": "railbird-rn",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"main": "node_modules/expo/AppEntry.js",
|
"main": "node_modules/expo/AppEntry.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "cp .env.development .env && expo start",
|
"start": "cp .env.development .env && expo start",
|
||||||
"start:android": "expo start --android",
|
"start:android": "expo start --android",
|
||||||
"start:ios": "expo start --ios",
|
"start:ios": "expo start --ios",
|
||||||
"android": "expo run:android",
|
"android": "expo run:android",
|
||||||
"ios": "expo run:ios",
|
"ios": "expo run:ios",
|
||||||
"web": "expo start --web",
|
"web": "expo start --web",
|
||||||
"lint": "eslint . --ext .js,.ts,.tsx",
|
"lint": "eslint . --ext .js,.ts,.tsx",
|
||||||
"lint:fix": "eslint . --ext .ts,.tsx --fix",
|
"lint:fix": "eslint . --ext .ts,.tsx --fix",
|
||||||
"test": "jest --forceExit"
|
"test": "jest --forceExit"
|
||||||
},
|
},
|
||||||
"jest": {
|
"jest": {
|
||||||
"preset": "jest-expo",
|
"preset": "jest-expo",
|
||||||
"transformIgnorePatterns": [
|
"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)/)"
|
"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": {
|
"dependencies": {
|
||||||
"@apollo/client": "^3.8.8",
|
"@apollo/client": "^3.8.8",
|
||||||
"@react-native-camera-roll/camera-roll": "^7.4.0",
|
"@react-native-camera-roll/camera-roll": "^7.4.0",
|
||||||
"@react-native-firebase/app": "^18.8.0",
|
"@react-native-firebase/app": "^18.8.0",
|
||||||
"@react-native-firebase/auth": "^18.8.0",
|
"@react-native-firebase/auth": "^18.8.0",
|
||||||
"@react-navigation/bottom-tabs": "^6.5.11",
|
"@react-navigation/bottom-tabs": "^6.5.11",
|
||||||
"@react-navigation/native": "^6.1.9",
|
"@react-navigation/native": "^6.1.9",
|
||||||
"@react-navigation/native-stack": "^6.9.17",
|
"@react-navigation/native-stack": "^6.9.17",
|
||||||
"@types/react": "~18.2.14",
|
"@types/react": "~18.2.14",
|
||||||
"@typescript-eslint/eslint-plugin": "^6.17.0",
|
"@typescript-eslint/eslint-plugin": "^6.17.0",
|
||||||
"@typescript-eslint/parser": "^6.17.0",
|
"@typescript-eslint/parser": "^6.17.0",
|
||||||
"babel-plugin-inline-dotenv": "^1.7.0",
|
"babel-plugin-inline-dotenv": "^1.7.0",
|
||||||
"d3-path": "^3.1.0",
|
"d3-path": "^3.1.0",
|
||||||
"d3-scale": "^1.0.6",
|
"d3-scale": "^1.0.6",
|
||||||
"eslint": "^8.56.0",
|
"eslint": "^8.56.0",
|
||||||
"eslint-plugin-react": "^7.33.2",
|
"eslint-plugin-react": "^7.33.2",
|
||||||
"eslint-plugin-react-hooks": "^4.6.0",
|
"eslint-plugin-react-hooks": "^4.6.0",
|
||||||
"eslint-plugin-react-native": "^4.1.0",
|
"eslint-plugin-react-native": "^4.1.0",
|
||||||
"expo": "~49.0.15",
|
"expo": "~49.0.15",
|
||||||
"expo-build-properties": "^0.11.0",
|
"expo-build-properties": "^0.11.0",
|
||||||
"expo-constants": "~14.4.2",
|
"expo-constants": "~14.4.2",
|
||||||
"expo-splash-screen": "~0.20.5",
|
"expo-splash-screen": "~0.20.5",
|
||||||
"expo-status-bar": "~1.6.0",
|
"expo-status-bar": "~1.6.0",
|
||||||
"graphql": "^16.8.1",
|
"graphql": "^16.8.1",
|
||||||
"jest": "^29.2.1",
|
"jest": "^29.2.1",
|
||||||
"jest-expo": "~49.0.0",
|
"jest-expo": "~49.0.0",
|
||||||
"railbird-gql": "git+https://dev.railbird.ai/railbird/railbird-gql.git#db82f66c5d3600d90f09c813f71287e176dc078b",
|
"railbird-gql": "git+https://dev.railbird.ai/railbird/railbird-gql.git#db82f66c5d3600d90f09c813f71287e176dc078b",
|
||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-native": "0.72.6",
|
"react-native": "0.72.6",
|
||||||
"react-native-dotenv": "^3.4.9",
|
"react-native-dotenv": "^3.4.9",
|
||||||
"react-native-dropdown-picker": "^5.4.6",
|
"react-native-dropdown-picker": "^5.4.6",
|
||||||
"react-native-reanimated": "^3.6.2",
|
"react-native-reanimated": "^3.6.2",
|
||||||
"react-native-safe-area-context": "^4.8.2",
|
"react-native-safe-area-context": "^4.8.2",
|
||||||
"react-native-screens": "~3.22.0",
|
"react-native-screens": "~3.22.0",
|
||||||
"react-native-static-safe-area-insets": "^2.2.0",
|
"react-native-static-safe-area-insets": "^2.2.0",
|
||||||
"react-native-svg": "13.9.0",
|
"react-native-svg": "13.9.0",
|
||||||
"react-native-svg-charts": "^5.4.0",
|
"react-native-svg-charts": "^5.4.0",
|
||||||
"typescript": "^5.3.3"
|
"typescript": "^5.3.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"typescript": "^5.3.3",
|
"@babel/core": "^7.20.0",
|
||||||
"@babel/core": "^7.20.0",
|
"@react-native/metro-config": "^0.72.9",
|
||||||
"@react-native/metro-config": "^0.72.9",
|
"@testing-library/jest-native": "^5.4.3",
|
||||||
"@testing-library/jest-native": "^5.4.3",
|
"@testing-library/react-native": "^12.4.3",
|
||||||
"@testing-library/react-native": "^12.4.3",
|
"@types/d3-path": "^3.0.2",
|
||||||
"@types/d3-path": "^3.0.2",
|
"@types/jest": "^29.5.11",
|
||||||
"@types/jest": "^29.5.11",
|
"@types/react-native-svg-charts": "^5.0.16",
|
||||||
"@types/react-native-svg-charts": "^5.0.16",
|
"eslint-config-prettier": "^9.1.0",
|
||||||
"eslint-config-prettier": "^9.1.0",
|
"metro-react-native-babel-preset": "^0.77.0",
|
||||||
"metro-react-native-babel-preset": "^0.77.0"
|
"prettier-plugin-organize-imports": "^3.2.4",
|
||||||
},
|
"typescript": "^5.3.3"
|
||||||
"private": true
|
},
|
||||||
|
"private": true
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
Subproject commit fb425458904eb240466768be08352973fd2f78d8
|
Subproject commit 0e05fc314fb759ec0944bf09c07aba9ad753fc2b
|
||||||
Loading…
Reference in New Issue
Block a user