brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

getting user in app

Browse source
This commit is contained in:
Carter 2024-10-24 12:21:52 -06:00
parent 90fd2905fb
commit 28b8578605
6 changed files with 62 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

2
.env
View file

@ -1,3 +1,5 @@
VITE_APP_API_URL=https://api.brandxtech.ca/v1
#Auth0
VITE_AUTH0_CLIENT_DOMAIN=brandxtech.auth0.com
VITE_AUTH0_AUDIENCE=pond.brandxtech.ca

9
package.json
View file

@ -4,13 +4,14 @@
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"start": "vite",
"start-local": "VITE_APP_API_URL=http://localhost:50052/v1 VITE_APP_WS_URL=ws://localhost:50052/v1/live VITE_APP_BILLING_URL=http://localhost:50053/v1 VITE_APP_RECLUSE_URL=http://localhost:50054/v1 VITE_APP_GITLAB_URL=http://localhost:50055/v1 vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview",
"build:staging": "NODE_OPTIONS=--max_old_space_size=4096 REACT_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} REACT_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_STAGING} REACT_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} REACT_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} REACT_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} REACT_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} REACT_APP_CNHI_SCOPES=${CNHI_SCOPES} REACT_APP_CNHI_CONNECTION=${CNHI_CONNECTION} REACT_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} REACT_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} REACT_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} REACT_APP_JD_CLIENT_ID=${JD_CLIENT_ID} REACT_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} REACT_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} REACT_APP_JD_SCOPES=${JD_SCOPES} REACT_APP_JD_STATE=${JD_STATE} vite build",
"build:development": "NODE_OPTIONS=--max_old_space_size=4096 REACT_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} REACT_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_DEVELOPMENT} REACT_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} REACT_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} REACT_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} REACT_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} REACT_APP_CNHI_SCOPES=${CNHI_SCOPES} REACT_APP_CNHI_CONNECTION=${CNHI_CONNECTION} REACT_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} REACT_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} REACT_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} REACT_APP_JD_CLIENT_ID=${JD_CLIENT_ID} REACT_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} REACT_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} REACT_APP_JD_SCOPES=${JD_SCOPES} REACT_APP_JD_STATE=${JD_STATE} vite build",
"build:production": "NODE_OPTIONS=--max_old_space_size=4096 REACT_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} REACT_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_PRODUCTION} REACT_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} REACT_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} REACT_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} REACT_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} REACT_APP_CNHI_SCOPES=${CNHI_SCOPES} REACT_APP_CNHI_CONNECTION=${CNHI_CONNECTION} REACT_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} REACT_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} REACT_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} REACT_APP_JD_CLIENT_ID=${JD_CLIENT_ID} REACT_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} REACT_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} REACT_APP_JD_SCOPES=${JD_SCOPES} REACT_APP_JD_STATE=${JD_STATE} vite build",
"build:staging": "NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_STAGING} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
"build:development": "NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_DEVELOPMENT} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
"build:production": "NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_PRODUCTION} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
"build:offline": "npx env-cmd offline,whitelabel npm run build",
"test": "vitest"
},

21
src/app/App.tsx
View file

@ -1,4 +1,4 @@
import { useState } from 'react'
import { useEffect, useState } from 'react'
import reactLogo from '../assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'
@ -8,15 +8,28 @@ import { or } from '../utils/types'
function App() {
const [count, setCount] = useState(0)
const [loading, setLoading] = useState(false)
const userAPI = useUserAPI();
const useAuth = useAuth0();
let user_id = or(useAuth.user?.sub, "")
// console.log("User ID: ", user_id)
if (user_id.length > 1) userAPI.getUser(user_id).then(resp => {
console.log(resp)
})
// if (user_id.length > 1) {
// userAPI.getUser(user_id).then(resp => {
// console.log(resp)
// })
// }
useEffect(() => {
if (loading) return;
setLoading(true)
userAPI.getUser(user_id).then(resp => {
console.log(resp)
}).finally(() => {
setLoading(false)
})
}, [])
return (
<><div>

10
src/app/AuthHTTPWrapper.tsx
View file

@ -3,8 +3,10 @@ import { or } from '../utils/types'
import AuthWrapper from '../providers/auth'
import HTTPProvider from '../providers/http'
import App from './App'
import { useState } from 'react'
function AuthHTTPWrapper() {
const [gotToken, setGotToken] = useState(false)
let url: string | undefined = window.location.origin;
let audience: string | undefined;
@ -30,8 +32,12 @@ function AuthHTTPWrapper() {
cacheLocation='localstorage'
>
<AuthWrapper>
<HTTPProvider>
<App/>
<HTTPProvider setGotToken={setGotToken}>
{gotToken ?
<App/>
:
<p>hi</p>
}
</HTTPProvider>
</AuthWrapper>
</Auth0Provider>

40
src/providers/http.tsx
View file

@ -24,38 +24,52 @@ interface IHTTPContext {
options: (demo?: boolean) => AxiosRequestConfig;
}
interface Props extends PropsWithChildren<any>{
setGotToken: React.Dispatch<React.SetStateAction<boolean>>;
}
export const HTTPContext = createContext<IHTTPContext>({} as IHTTPContext);
export default function HTTPProvider(props: PropsWithChildren<any>) {
const { children } = props;
export default function HTTPProvider(props: Props) {
const { children, setGotToken } = props;
const { isAuthenticated, /*token,*/ getAccessTokenSilently } = useAuth0();
const [token, setToken] = useState("");
useEffect(() => {
if (isAuthenticated) getAccessTokenSilently().then(t => {
setToken(t)
}).finally(() => {
setGotToken(true)
})
}, [setToken, isAuthenticated])
const defaultOptions = (demo: boolean = false) => {
if (demo || !isAuthenticated || !token) {
return {
headers: {
"Content-Type": "application/json"
}
};
}
// if (demo || !isAuthenticated || !token) {
// console.log("demo: ", demo)
// console.log("Authenticated: ", isAuthenticated)
// console.log("token: ", token)
// return {
// headers: {
// "Content-Type": "application/json"
// }
// };
// }
return {
// console.log("Getting options with Bearer")
// console.log(token)
const config = {
headers: {
Authorization: "Bearer " + token,
Authorization: `Bearer ${token}`,
"Content-Type": "application/json"
}
};
return config;
};
function get<T>(url: string, spreadOptions?: AxiosRequestConfig): Promise<AxiosResponse<T>> {
return axios.get(url, { ...defaultOptions(), ...spreadOptions });
function get<T>(url: string): Promise<AxiosResponse<T>> {
console.log(defaultOptions())
return axios.get(url, {...defaultOptions()});
}
function put<T>(

3
src/providers/pond/pond.tsx
View file

@ -2,7 +2,8 @@ import { PropsWithChildren } from "react";
import UserProvider, { useUserAPI } from "./userAPI";
export const pondURL = (partial: string, demo: boolean = false): string => {
let url = import.meta.env.REACT_APP_API_URL + (demo ? "/demo" : "") + partial;
let url = import.meta.env.VITE_APP_API_URL + (demo ? "/demo" : "") + partial;
console.log(url)
// if (isStaging()) url = process.env.REACT_APP_STAGING_API_URL + (demo ? "/demo" : "") + partial;
return url;
};