mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-07 20:31:06 -05:00
Merge pull request #17691 from overleaf/ii-copy-project-mobile
[web] Show modal on mobile when copying a project GitOrigin-RevId: db0887b91c80f169539d4d02ae9745d9a60abaa3
This commit is contained in:
parent
cfd13b7aa0
commit
ab71a2edb2
2 changed files with 19 additions and 7 deletions
|
@ -21,8 +21,11 @@ type ActionButtonProps = {
|
|||
function CopyProjectButtonMenuItem({ project, onClick }: ActionButtonProps) {
|
||||
return (
|
||||
<CopyProjectButton project={project}>
|
||||
{text => (
|
||||
<MenuItemButton onClick={onClick} className="projects-action-menu-item">
|
||||
{(text, handleOpenModal) => (
|
||||
<MenuItemButton
|
||||
onClick={() => handleOpenModal(onClick)}
|
||||
className="projects-action-menu-item"
|
||||
>
|
||||
<Icon type="files-o" className="menu-item-button-icon" />{' '}
|
||||
<span className="menu-item-button-text">{text}</span>
|
||||
</MenuItemButton>
|
||||
|
|
|
@ -13,9 +13,14 @@ import {
|
|||
import { useProjectTags } from '@/features/project-list/hooks/use-project-tags'
|
||||
import { isSmallDevice } from '../../../../../../infrastructure/event-tracking'
|
||||
|
||||
type HandleOpenModal = (fn?: () => void) => void
|
||||
|
||||
type CopyButtonProps = {
|
||||
project: Project
|
||||
children: (text: string, handleOpenModal: () => void) => React.ReactElement
|
||||
children: (
|
||||
text: string,
|
||||
handleOpenModal: HandleOpenModal
|
||||
) => React.ReactElement
|
||||
}
|
||||
|
||||
function CopyProjectButton({ project, children }: CopyButtonProps) {
|
||||
|
@ -31,9 +36,13 @@ function CopyProjectButton({ project, children }: CopyButtonProps) {
|
|||
const isMounted = useIsMounted()
|
||||
const projectTags = useProjectTags(project.id)
|
||||
|
||||
const handleOpenModal = useCallback(() => {
|
||||
setShowModal(true)
|
||||
}, [])
|
||||
const handleOpenModal = useCallback(
|
||||
(onOpen?: Parameters<HandleOpenModal>[0]) => {
|
||||
setShowModal(true)
|
||||
onOpen?.()
|
||||
},
|
||||
[]
|
||||
)
|
||||
|
||||
const handleCloseModal = useCallback(() => {
|
||||
if (isMounted.current) {
|
||||
|
@ -97,7 +106,7 @@ const CopyProjectButtonTooltip = memo(function CopyProjectButtonTooltip({
|
|||
<button
|
||||
className="btn btn-link action-btn"
|
||||
aria-label={text}
|
||||
onClick={handleOpenModal}
|
||||
onClick={() => handleOpenModal()}
|
||||
>
|
||||
<Icon type="files-o" fw />
|
||||
</button>
|
||||
|
|
Loading…
Reference in a new issue