diff --git a/src/mocks/AppHarness.js b/src/mocks/AppHarness.js index 45918d967cceef058f0fb7dce604d36f8fd5441e..f05316c377e93d619bce97d6bbdfd496b06e9c6f 100644 --- a/src/mocks/AppHarness.js +++ b/src/mocks/AppHarness.js @@ -8,6 +8,7 @@ import { NotificationProvider } from "../components/common/notification/Notifica import NavigationMenu from "../components/navigation/NavigationMenu"; import { MemoryRouter } from "react-router-dom"; import { DeployAPIProvider } from "../api/DeployApi"; +import { TestUserProvider, UserImpersonator } from "./UserImpersonator"; export function RouterHarness({ children, initialHistory = ["/"] }) { return ( @@ -22,20 +23,33 @@ export function RouterHarness({ children, initialHistory = ["/"] }) { ); } -export function AppHarness({ children, initialHistory = ["/"] }) { +export function AppHarness({ + children, + initialHistory = ["/"], + useTestUser = false, + ...args +}) { + const SelectedUserProvider = useTestUser + ? ({ children }) => ( + <TestUserProvider> + <UserImpersonator {...args}>{children}</UserImpersonator> + </TestUserProvider> + ) + : UserProvider; + return ( <SnackbarProvider preventDuplicate maxSnack="5" > <RouterHarness initialHistory={initialHistory}> - <UserProvider> + <SelectedUserProvider> <NotificationProvider> <NavigationMenu> <Container>{children}</Container> </NavigationMenu> </NotificationProvider> - </UserProvider> + </SelectedUserProvider> </RouterHarness> </SnackbarProvider> ); diff --git a/src/mocks/UserImpersonator.js b/src/mocks/UserImpersonator.js new file mode 100644 index 0000000000000000000000000000000000000000..5f9a2e9ed85621aea3cd9266238235dedacc6fbb --- /dev/null +++ b/src/mocks/UserImpersonator.js @@ -0,0 +1,67 @@ +import React, { useCallback, useContext, useEffect, useState } from "react"; +import testUser from "./fixtures/User.json"; +import { userContext } from "@ess-ics/ce-ui-common"; + +const testAuthContext = userContext; + +export const defaultUser = testUser; +export const defaultUserRoles = [ + "DeploymentToolAdmin", + "DeploymentToolIntegrator" +]; +const defaultLogin = (username, password) => { + console.log( + `Login called with username '${username}', password '${password}'` + ); +}; +const defaultLogout = () => { + console.log("Logout called"); +}; +const defaultLoginError = ""; + +const TestAuthContextProvider = ({ children }) => { + const [user, setUser] = useState(defaultUser); + const [userRoles, setUserRoles] = useState(defaultUserRoles); + const [login, setLogin] = useState(defaultLogin); + const [loginError, setLoginError] = useState(defaultLoginError); + const [logout, setLogout] = useState(defaultLogout); + + const resetLoginError = useCallback(() => { + setLoginError(defaultLoginError); + }, [setLoginError]); + + const value = { + user, + setUser, + userRoles, + setUserRoles, + login, + setLogin, + loginError, + setLoginError, + logout, + setLogout, + resetLoginError + }; + + return ( + <testAuthContext.Provider value={value}> + {children} + </testAuthContext.Provider> + ); +}; + +export const TestUserProvider = ({ children }) => { + return <TestAuthContextProvider>{children}</TestAuthContextProvider>; +}; + +export const UserImpersonator = ({ user, userRoles, children }) => { + const { setUser, setUserRoles } = useContext(testAuthContext); + + useEffect(() => { + setUser(user); + setUserRoles(userRoles); + }, [setUser, setUserRoles, user, userRoles]); + + return <>{children}</>; +}; diff --git a/src/stories/utils/common-args.js b/src/stories/utils/common-args.js index ed66429f96cd717df1356a6c267388143165e686..f9db9c2e0a7b609fcdd21581d9cb1e4c56f24846 100644 --- a/src/stories/utils/common-args.js +++ b/src/stories/utils/common-args.js @@ -1,3 +1,5 @@ +import { defaultUser, defaultUserRoles } from "../../mocks/UserImpersonator"; + // see https://storybook.js.org/docs/react/essentials/controls#disable-controls-for-specific-properties export const hideStorybookControls = { table: { @@ -11,3 +13,8 @@ export const paginationNoResults = { rows: 10, page: 0 }; + +export const userImpersonatorArgs = { + user: { ...defaultUser }, + userRoles: [...defaultUserRoles] +}; diff --git a/src/stories/views/IOC/CreateIocView.stories.js b/src/stories/views/IOC/CreateIocView.stories.js index 75d7186ec151cced383336f3d4ea7e5765f9df23..be01c9f536dbc9fd25cece0bcfafe5c260564279 100644 --- a/src/stories/views/IOC/CreateIocView.stories.js +++ b/src/stories/views/IOC/CreateIocView.stories.js @@ -3,20 +3,30 @@ import { AppHarness } from "../../../mocks/AppHarness"; import { CreateIOCView } from "../../../views/IOC/CreateIOCView"; import { rest } from "msw"; import { handlers } from "../../../mocks/handlers"; +import { userImpersonatorArgs } from "../../utils/common-args"; export default { title: "Views/IOC/CreateIOCView" }; -const Template = () => ( - <AppHarness> +const Template = (args) => ( + <AppHarness + useTestUser + {...args} + > <CreateIOCView /> </AppHarness> ); -export const Default = () => <Template />; +export const Default = (args) => <Template {...args} />; +Default.args = { + ...userImpersonatorArgs +}; -export const CreateLoading = () => <Template />; +export const CreateLoading = (args) => <Template {...args} />; +CreateLoading.args = { + ...Default.args +}; CreateLoading.parameters = { msw: { handlers: [ @@ -25,7 +35,11 @@ CreateLoading.parameters = { ] } }; -export const CreateWithError = () => <Template />; + +export const CreateWithError = (args) => <Template {...args} />; +CreateWithError.args = { + ...Default.args +}; CreateWithError.parameters = { msw: { handlers: [ diff --git a/src/stories/views/IOC/IocDetailsView.stories.js b/src/stories/views/IOC/IocDetailsView.stories.js index 1b0a93155a47808dc9af6cbc565a5bc6bdc07e2c..52b5c4a03cc4523d0dc2f04d9f2595f17c14653a 100644 --- a/src/stories/views/IOC/IocDetailsView.stories.js +++ b/src/stories/views/IOC/IocDetailsView.stories.js @@ -1,13 +1,17 @@ import React from "react"; import { AppHarness } from "../../../mocks/AppHarness"; import { IOCDetailsContainer } from "../../../views/IOC/IOCDetailsContainer"; +import { userImpersonatorArgs } from "../../utils/common-args"; export default { title: "Views/IOC/IOCDetailsView" }; const Template = (args) => ( - <AppHarness> + <AppHarness + useTestUser + {...args} + > <IOCDetailsContainer id={346} {...args} @@ -15,9 +19,13 @@ const Template = (args) => ( </AppHarness> ); -export const Default = () => <Template />; +export const Default = (args) => <Template {...args} />; +Default.args = { + ...userImpersonatorArgs +}; export const Deployable = (args) => <Template {...args} />; Deployable.args = { - id: 2 + id: 2, + ...Default.args }; diff --git a/src/stories/views/Login/LoginView.stories.js b/src/stories/views/Login/LoginView.stories.js index d459b14d54f45592163774d608deae00b4c62302..43314ab83e689eddfa3a43175bb5ea5747b75824 100644 --- a/src/stories/views/Login/LoginView.stories.js +++ b/src/stories/views/Login/LoginView.stories.js @@ -7,7 +7,11 @@ export default { }; export const Default = () => ( - <AppHarness initialHistory={["/login"]}> + <AppHarness + initialHistory={["/login"]} + useTestUser + user={null} + > <LoginView /> </AppHarness> ); diff --git a/src/stories/views/UserPage/UserPageView.stories.js b/src/stories/views/UserPage/UserPageView.stories.js index 78c593a8ee22e37ad5b644a806ae829170687928..eac248ee3441328e33fcc921655567f4b30e599d 100644 --- a/src/stories/views/UserPage/UserPageView.stories.js +++ b/src/stories/views/UserPage/UserPageView.stories.js @@ -1,13 +1,22 @@ import React from "react"; import { UserDetailsContainer } from "../../../views/UserPage"; import { AppHarness } from "../../../mocks/AppHarness"; +import { userImpersonatorArgs } from "../../utils/common-args"; export default { title: "Views/UserPage/UserPageView" }; -export const Default = () => ( - <AppHarness> +const Template = (args) => ( + <AppHarness + useTestUser + {...args} + > <UserDetailsContainer /> </AppHarness> ); + +export const Default = (args) => <Template {...args} />; +Default.args = { + ...userImpersonatorArgs +};