mirror of
https://github.com/overleaf/overleaf.git
synced 2024-12-12 16:43:23 -05:00
b85ae6e58e
* Migrate actions menu in editor left menu to react * Move margin from inline style to css file * remove focus selector to avoid "highlighting" the button after closing modal and regain focus * Add disabled state on word count button when the compiling is loading or failed * Use div instead of button for disabled word count button * Add accessibility text props when LeftMenuButton is disabled * Add actions menu test cases and storybook components * use util assign function and wrap function prop in usecallback GitOrigin-RevId: 81ab104be21fbcf5dfbc72c07d29eeb32976c61f
57 lines
1.3 KiB
TypeScript
57 lines
1.3 KiB
TypeScript
import ActionsMenu from '../../js/features/editor-left-menu/components/actions-menu'
|
|
import { ScopeDecorator } from '../decorators/scope'
|
|
import { mockCompile, mockCompileError } from '../fixtures/compile'
|
|
import { document, mockDocument } from '../fixtures/document'
|
|
import useFetchMock from '../hooks/use-fetch-mock'
|
|
import { useScope } from '../hooks/use-scope'
|
|
|
|
export default {
|
|
title: 'Editor / Left Menu / Actions Menu',
|
|
component: ActionsMenu,
|
|
decorators: [
|
|
(Story: any) => ScopeDecorator(Story, { mockCompileOnLoad: false }),
|
|
],
|
|
}
|
|
|
|
export const NotCompiled = () => {
|
|
window.metaAttributesCache.set('ol-anonymous', false)
|
|
|
|
useFetchMock(fetchMock => {
|
|
mockCompileError(fetchMock, 'failure')
|
|
})
|
|
|
|
return (
|
|
<div id="left-menu" className="shown">
|
|
<ActionsMenu />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export const CompileSuccess = () => {
|
|
window.metaAttributesCache.set('ol-anonymous', false)
|
|
|
|
useScope({
|
|
editor: {
|
|
sharejs_doc: mockDocument(document.tex),
|
|
},
|
|
})
|
|
|
|
useFetchMock(fetchMock => {
|
|
mockCompile(fetchMock)
|
|
fetchMock.get('express:/project/:projectId/wordcount', {
|
|
texcount: {
|
|
encode: 'ascii',
|
|
textWords: 10,
|
|
headers: 11,
|
|
mathInline: 12,
|
|
mathDisplay: 13,
|
|
},
|
|
})
|
|
})
|
|
|
|
return (
|
|
<div id="left-menu" className="shown">
|
|
<ActionsMenu />
|
|
</div>
|
|
)
|
|
}
|