overleaf/services/web/frontend/stories/pdf-preview-messages.stories.tsx
Alf Eaton 3bf468f599 Add Storybook stories for compile timeout messages (#15371)
GitOrigin-RevId: 91206fcfea0dc0ef18d435e2f58284e5837d4b4d
2023-10-25 08:04:29 +00:00

60 lines
2 KiB
TypeScript

import { useEffect } from 'react'
import { ScopeDecorator } from './decorators/scope'
import { useLocalCompileContext } from '@/shared/context/local-compile-context'
import { PdfPreviewMessages } from '@/features/pdf-preview/components/pdf-preview-messages'
import CompileTimeWarning from '@/features/pdf-preview/components/compile-time-warning'
import { CompileTimeoutChangingSoon } from '@/features/pdf-preview/components/compile-timeout-changing-soon'
import { CompileTimeoutWarning } from '@/features/pdf-preview/components/compile-timeout-warning'
export default {
title: 'Editor / PDF Preview / Messages',
component: PdfPreviewMessages,
decorators: [
ScopeDecorator,
(Story: any) => (
<div style={{ width: 800, position: 'relative' }}>
<PdfPreviewMessages>
<Story />
</PdfPreviewMessages>
</div>
),
],
}
export const CompileTime = () => {
const { setShowCompileTimeWarning } = useLocalCompileContext()
useEffect(() => {
setShowCompileTimeWarning(true)
}, [setShowCompileTimeWarning])
return <CompileTimeWarning />
}
export const CompileTimeoutChangingSoonNotProjectOwner = (args: any) => {
return <CompileTimeoutChangingSoon {...args} />
}
CompileTimeoutChangingSoonNotProjectOwner.argTypes = {
handleDismissChangingSoon: { action: 'dismiss changing soon' },
}
export const CompileTimeoutChangingSoonProjectOwner = (args: any) => {
return <CompileTimeoutChangingSoon {...args} isProjectOwner />
}
CompileTimeoutChangingSoonProjectOwner.argTypes = {
handleDismissChangingSoon: { action: 'dismiss changing soon' },
}
export const CompileTimeoutWarningActive = (args: any) => {
return <CompileTimeoutWarning {...args} showNewCompileTimeoutUI="active" />
}
CompileTimeoutWarningActive.argTypes = {
handleDismissWarning: { action: 'dismiss warning' },
}
export const CompileTimeoutWarningChanging = (args: any) => {
return <CompileTimeoutWarning {...args} showNewCompileTimeoutUI="changing" />
}
CompileTimeoutWarningChanging.argTypes = {
handleDismissWarning: { action: 'dismiss warning' },
}