diff --git a/front/src/AppWrapper.tsx b/front/src/AppWrapper.tsx
new file mode 100644
index 000000000..1ae1494f5
--- /dev/null
+++ b/front/src/AppWrapper.tsx
@@ -0,0 +1,28 @@
+import { StrictMode } from 'react';
+import { BrowserRouter } from 'react-router-dom';
+import { ApolloProvider } from '@apollo/client';
+import { useRecoilState } from 'recoil';
+
+import { isMockModeState } from '@/auth/states/isMockModeState';
+
+import { AppThemeProvider } from './providers/AppThemeProvider';
+import { AuthProvider } from './providers/AuthProvider';
+import { apiClient, mockClient } from './apollo';
+import { App } from './App';
+
+export function AppWrapper() {
+ const [isMockMode] = useRecoilState(isMockModeState);
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/front/src/apollo.tsx b/front/src/apollo.tsx
index 9211e685b..4b512af97 100644
--- a/front/src/apollo.tsx
+++ b/front/src/apollo.tsx
@@ -1,5 +1,6 @@
import {
ApolloClient,
+ ApolloLink,
createHttpLink,
from,
InMemoryCache,
@@ -11,6 +12,8 @@ import { RestLink } from 'apollo-link-rest';
import { CommentThreadTarget } from './generated/graphql';
import { getTokensFromRefreshToken } from './modules/auth/services/AuthService';
+import { mockedCompaniesData } from './testing/mock-data/companies';
+import { mockedUsersData } from './testing/mock-data/users';
const apiLink = createHttpLink({
uri: `${process.env.REACT_APP_API_URL}`,
@@ -98,3 +101,25 @@ export const authClient = new ApolloClient({
link: authLink,
cache: new InMemoryCache(),
});
+
+const mockLink = new ApolloLink((operation, forward) => {
+ return forward(operation).map((response) => {
+ if (operation.operationName === 'GetCompanies') {
+ return { data: { companies: mockedCompaniesData } };
+ }
+ if (operation.operationName === 'GetCurrentUser') {
+ return { data: { users: [mockedUsersData[0]] } };
+ }
+ return response;
+ });
+});
+
+export const mockClient = new ApolloClient({
+ link: from([mockLink, apiLink]),
+ cache: new InMemoryCache(),
+ defaultOptions: {
+ query: {
+ fetchPolicy: 'cache-first',
+ },
+ },
+});
diff --git a/front/src/index.tsx b/front/src/index.tsx
index 974e72ea9..7f180162f 100644
--- a/front/src/index.tsx
+++ b/front/src/index.tsx
@@ -1,35 +1,21 @@
-import React, { StrictMode } from 'react';
+import React from 'react';
import ReactDOM from 'react-dom/client';
-import { BrowserRouter } from 'react-router-dom';
-import { ApolloProvider } from '@apollo/client';
import { RecoilRoot } from 'recoil';
import '@emotion/react';
import { ThemeType } from './modules/ui/layout/styles/themes';
-import { AppThemeProvider } from './providers/AppThemeProvider';
-import { AuthProvider } from './providers/AuthProvider';
-import { apiClient } from './apollo';
-import { App } from './App';
+import { AppWrapper } from './AppWrapper';
import './index.css';
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement,
);
+
root.render(
-
-
-
-
-
-
-
-
-
-
-
+
,
);
diff --git a/front/src/modules/auth/hooks/useMockData.ts b/front/src/modules/auth/hooks/useMockData.ts
deleted file mode 100644
index e5fed599d..000000000
--- a/front/src/modules/auth/hooks/useMockData.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { graphql, setupWorker } from 'msw';
-
-import { mockedCompaniesData } from '~/testing/mock-data/companies';
-import { mockedUsersData } from '~/testing/mock-data/users';
-
-export function useMockData() {
- const worker = setupWorker(...graphqlMocks);
- worker.start({ quiet: true, onUnhandledRequest: 'bypass' });
-}
-
-const graphqlMocks = [
- graphql.query('GetCompanies', (req, res, ctx) => {
- return res(
- ctx.data({
- companies: mockedCompaniesData,
- }),
- );
- }),
-
- graphql.query('GetCurrentUser', (req, res, ctx) => {
- return res(
- ctx.data({
- users: [mockedUsersData[0]],
- }),
- );
- }),
-];
diff --git a/front/src/modules/auth/states/isMockModeState.ts b/front/src/modules/auth/states/isMockModeState.ts
new file mode 100644
index 000000000..3d29e5ce3
--- /dev/null
+++ b/front/src/modules/auth/states/isMockModeState.ts
@@ -0,0 +1,6 @@
+import { atom } from 'recoil';
+
+export const isMockModeState = atom({
+ key: 'isMockModeState',
+ default: false,
+});
diff --git a/front/src/pages/auth/Index.tsx b/front/src/pages/auth/Index.tsx
index 0766b862f..57659c967 100644
--- a/front/src/pages/auth/Index.tsx
+++ b/front/src/pages/auth/Index.tsx
@@ -10,9 +10,9 @@ import { HorizontalSeparator } from '@/auth/components/ui/HorizontalSeparator';
import { Logo } from '@/auth/components/ui/Logo';
import { Modal } from '@/auth/components/ui/Modal';
import { Title } from '@/auth/components/ui/Title';
-import { useMockData } from '@/auth/hooks/useMockData';
import { hasAccessToken } from '@/auth/services/AuthService';
import { authFlowUserEmailState } from '@/auth/states/authFlowUserEmailState';
+import { isMockModeState } from '@/auth/states/isMockModeState';
import { PrimaryButton } from '@/ui/components/buttons/PrimaryButton';
import { SecondaryButton } from '@/ui/components/buttons/SecondaryButton';
import { TextInput } from '@/ui/components/inputs/TextInput';
@@ -28,17 +28,19 @@ const StyledContentContainer = styled.div`
export function Index() {
const navigate = useNavigate();
const theme = useTheme();
- useMockData();
+ const [, setMockMode] = useRecoilState(isMockModeState);
const [authFlowUserEmail, setAuthFlowUserEmail] = useRecoilState(
authFlowUserEmailState,
);
useEffect(() => {
+ setMockMode(true);
+
if (hasAccessToken()) {
navigate('/');
}
- }, [navigate]);
+ }, [navigate, setMockMode]);
const onGoogleLoginClick = useCallback(() => {
window.location.href = process.env.REACT_APP_AUTH_URL + '/google' || '';
diff --git a/front/src/pages/auth/PasswordLogin.tsx b/front/src/pages/auth/PasswordLogin.tsx
index 92142fee7..b237a30f4 100644
--- a/front/src/pages/auth/PasswordLogin.tsx
+++ b/front/src/pages/auth/PasswordLogin.tsx
@@ -11,6 +11,7 @@ import { SubTitle } from '@/auth/components/ui/SubTitle';
import { Title } from '@/auth/components/ui/Title';
import { getTokensFromLoginToken } from '@/auth/services/AuthService';
import { authFlowUserEmailState } from '@/auth/states/authFlowUserEmailState';
+import { isMockModeState } from '@/auth/states/isMockModeState';
import { PrimaryButton } from '@/ui/components/buttons/PrimaryButton';
import { TextInput } from '@/ui/components/inputs/TextInput';
import { Companies } from '~/pages/companies/Companies';
@@ -35,6 +36,7 @@ const StyledErrorContainer = styled.div`
export function PasswordLogin() {
const navigate = useNavigate();
+ const [, setMockMode] = useRecoilState(isMockModeState);
const prefillPassword =
process.env.NODE_ENV === 'development' ? 'applecar2025' : '';
@@ -60,19 +62,22 @@ export function PasswordLogin() {
},
);
- if (response.ok) {
- const { loginToken } = await response.json();
- if (!loginToken) {
- // TODO Display error message
- return;
- }
- await getTokensFromLoginToken(loginToken.token);
- navigate('/');
+ if (!response.ok) {
+ const errorData = await response.json();
+ setFormError(errorData.message);
return;
}
- const errorData = await response.json();
- setFormError(errorData.message);
- }, [authFlowUserEmail, internalPassword, navigate]);
+ const { loginToken } = await response.json();
+
+ if (!loginToken) {
+ return;
+ }
+
+ await getTokensFromLoginToken(loginToken.token);
+ setMockMode(false);
+
+ navigate('/');
+ }, [authFlowUserEmail, internalPassword, navigate, setMockMode]);
useHotkeys(
'enter',
diff --git a/server/package.json b/server/package.json
index 233e479e4..eeaa8b3a5 100644
--- a/server/package.json
+++ b/server/package.json
@@ -24,7 +24,7 @@
"prisma:generate-nest-graphql": "npx prisma generate --generator nestgraphql && eslint \"src/core/@generated/**\" --fix",
"prisma:migrate": "npx prisma migrate deploy",
"prisma:seed": "npx prisma db seed",
- "prisma:reset": "yarn prisma:generate-client && yarn prisma:generate-nest-graphql && npx prisma migrate reset"
+ "prisma:reset": "npx prisma migrate reset && eslint \"src/core/@generated/**\" --fix"
},
"dependencies": {
"@apollo/server": "^4.7.3",