github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #17691 from overleaf/ii-copy-project-mobile

Browse source 
[web] Show modal on mobile when copying a project

GitOrigin-RevId: db0887b91c80f169539d4d02ae9745d9a60abaa3
This commit is contained in:
ilkin-overleaf 2024-04-03 14:02:16 +03:00 committed by Copybot
parent cfd13b7aa0
commit ab71a2edb2
2 changed files with 19 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
services/web/frontend/js/features/project-list/components/dropdown/actions-dropdown.tsx
View file

@ -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>

19
services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx
View file

@ -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>