overleaf/services/web/frontend/stories/settings/page.stories.jsx
Antoine Clausse 4a8b79080b [storybook] Update Storybook and add a control for BS3/BS5 (#20948)
* [storybook] Update Storybook to version 8.3.5

* [storybook] Run storybook with `--no-open`. Fixes xdg-utils issue

* [storybook] Create decorator for BS3/BS5

* [storybook] Add `bsVersionDecorator` to stories

* [storybook] Fix bugs in stories

* [storybook] Fixup `useMeta` type. Use `DeepPartial`

* [storybook] Fix types

GitOrigin-RevId: 48c0f0fefb1ab2d4863ab59051b900b1908a613c
2024-10-14 11:07:40 +00:00

85 lines
2.3 KiB
JavaScript

import useFetchMock from '../hooks/use-fetch-mock'
import SettingsPageRoot from '../../js/features/settings/components/root'
import {
setDefaultMeta as setDefaultLeaveMeta,
defaultSetupMocks as defaultSetupLeaveMocks,
} from './helpers/leave'
import {
setDefaultMeta as setDefaultAccountInfoMeta,
defaultSetupMocks as defaultSetupAccountInfoMocks,
} from './helpers/account-info'
import {
setDefaultMeta as setDefaultPasswordMeta,
defaultSetupMocks as defaultSetupPasswordMocks,
} from './helpers/password'
import {
setDefaultMeta as setDefaultEmailsMeta,
defaultSetupMocks as defaultSetupEmailsMocks,
} from './helpers/emails'
import {
setDefaultMeta as setDefaultLinkingMeta,
defaultSetupMocks as defaultSetupLinkingMocks,
setPersonalAccessTokensMeta,
} from './helpers/linking'
import { UserProvider } from '../../js/shared/context/user-context'
import { ScopeDecorator } from '../decorators/scope'
import getMeta from '@/utils/meta'
import { bsVersionDecorator } from '../../../.storybook/utils/with-bootstrap-switcher'
export const Overleaf = args => {
setDefaultLeaveMeta()
setDefaultAccountInfoMeta()
setDefaultPasswordMeta()
setDefaultEmailsMeta()
setDefaultLinkingMeta()
useFetchMock(fetchMock => {
defaultSetupLeaveMocks(fetchMock)
defaultSetupAccountInfoMocks(fetchMock)
defaultSetupPasswordMocks(fetchMock)
defaultSetupEmailsMocks(fetchMock)
defaultSetupLinkingMocks(fetchMock)
})
return (
<UserProvider>
<SettingsPageRoot {...args} />
</UserProvider>
)
}
export const OverleafWithAccessTokens = args => {
setPersonalAccessTokensMeta()
return Overleaf(args)
}
export const ServerPro = args => {
setDefaultAccountInfoMeta()
setDefaultPasswordMeta()
setPersonalAccessTokensMeta()
useFetchMock(fetchMock => {
defaultSetupAccountInfoMocks(fetchMock)
defaultSetupPasswordMocks(fetchMock)
})
Object.assign(getMeta('ol-ExposedSettings'), {
hasAffiliationsFeature: false,
isOverleaf: false,
})
window.metaAttributesCache.set('ol-hideLinkingWidgets', true)
window.metaAttributesCache.delete('ol-oauthProviders')
return (
<UserProvider>
<SettingsPageRoot {...args} />
</UserProvider>
)
}
export default {
title: 'Account Settings / Full Page',
component: SettingsPageRoot,
decorators: [ScopeDecorator],
argTypes: {
...bsVersionDecorator.argTypes,
},
}