90 lines
2.6 KiB
TypeScript
90 lines
2.6 KiB
TypeScript
import { ApolloClient, ApolloProvider, HttpLink, InMemoryCache, from } from '@apollo/client';
|
|
import { onError } from '@apollo/client/link/error';
|
|
import '@client/assets/styles/index.css';
|
|
import '@client/assets/styles/nerd-fonts-icons.css';
|
|
import { Provider } from '@client/components/ui/provider';
|
|
import { Toaster } from '@client/components/ui/toaster';
|
|
import { RouterProvider, createRouter } from '@tanstack/react-router';
|
|
import { StrictMode, createContext, useState } from 'react';
|
|
import ReactDOM from 'react-dom/client';
|
|
|
|
// TanStackRouter - Import the generated route tree
|
|
import { Session } from 'inspector';
|
|
import { routeTree } from './routeTree.gen';
|
|
|
|
// Create a new router instance
|
|
const router = createRouter({ routeTree });
|
|
|
|
// Register the router instance for type safety
|
|
declare module '@tanstack/react-router' {
|
|
interface Register {
|
|
router: typeof router;
|
|
}
|
|
}
|
|
|
|
// Environment
|
|
const MODE = import.meta.env.VITE_MODE || 'prod';
|
|
const isProd = MODE === 'prod';
|
|
|
|
const HOST = import.meta.env.VITE_HOST || 'localhost';
|
|
const PORT = import.meta.env.VITE_PORT || '3000';
|
|
const uri = `https://${HOST}:${PORT}/graphql`;
|
|
|
|
// Auth context
|
|
export const AuthContext = createContext<any>(null);
|
|
|
|
function App() {
|
|
const [authHeaders, setAuthHeaders] = useState<Session | null>(null);
|
|
const AuthProvider = AuthContext.Provider;
|
|
|
|
// if (authHeaders == null) refreshToken();
|
|
|
|
const httpLink = new HttpLink({
|
|
uri,
|
|
credentials: 'include',
|
|
headers: authHeaders != null ? { authorization: JSON.stringify(authHeaders) } : undefined
|
|
});
|
|
|
|
const errorLink = onError(({ graphQLErrors, networkError }) => {
|
|
if (graphQLErrors)
|
|
graphQLErrors.forEach(({ message, locations, path }) =>
|
|
console.error(`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`)
|
|
);
|
|
|
|
if (networkError) console.error(`[Network error]: ${networkError}`);
|
|
});
|
|
|
|
const client = new ApolloClient({
|
|
uri,
|
|
link: isProd ? undefined : from([errorLink, httpLink]),
|
|
cache: new InMemoryCache(),
|
|
connectToDevTools: !isProd,
|
|
credentials: 'include'
|
|
});
|
|
|
|
return (
|
|
<StrictMode>
|
|
<AuthProvider
|
|
value={{
|
|
authHeaders,
|
|
setHeaders: (session: Session) => {
|
|
setAuthHeaders(session);
|
|
}
|
|
}}
|
|
>
|
|
<ApolloProvider client={client}>
|
|
<Provider>
|
|
<Toaster />
|
|
<RouterProvider router={router} />
|
|
</Provider>
|
|
</ApolloProvider>
|
|
</AuthProvider>
|
|
</StrictMode>
|
|
);
|
|
}
|
|
|
|
const rootElement = document.getElementById('root')!;
|
|
if (!rootElement.innerHTML) {
|
|
const root = ReactDOM.createRoot(rootElement);
|
|
root.render(<App />);
|
|
}
|