mirror/insomnia
1
0
Fork 0
mirror of https://github.com/Kong/insomnia.git synced 2026-04-21 14:47:46 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix(ux): duplicate improvement

Browse Source
This commit is contained in:
Curry Yang
2024-08-05 15:40:52 +08:00
parent 4d834f0304
commit e48e8c8a7f
2 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/insomnia/src/ui/components/dropdowns/workspace-dropdown.tsx
View File

@@ -1,5 +1,5 @@
import type { IconName } from '@fortawesome/fontawesome-svg-core';
import React, { type FC, type ReactNode, useCallback, useState } from 'react';
import React, { type FC, type ReactNode, useCallback, useEffect, useState } from 'react';
import { Button, Collection, Dialog, Header, Heading, Menu, MenuItem, MenuTrigger, Modal, ModalOverlay, Popover, Section } from 'react-aria-components';
import { useFetcher, useParams, useRouteLoaderData } from 'react-router-dom';
@@ -51,6 +51,11 @@ export const WorkspaceDropdown: FC = () => {
const [actionPlugins, setActionPlugins] = useState<WorkspaceAction[]>([]);
const [loadingActions, setLoadingActions] = useState<Record<string, boolean>>({});
// after duplicate workspace, close the modal
useEffect(() => {
setIsDuplicateModalOpen(false);
}, [workspaceId]);
const {
access,
generateTests,

8
packages/insomnia/src/ui/components/modals/workspace-duplicate-modal.tsx
View File

@@ -1,6 +1,6 @@
import React, { type FC, useEffect, useRef } from 'react';
import { OverlayContainer } from 'react-aria';
import { useFetcher, useParams } from 'react-router-dom';
import { useFetcher, useNavigation, useParams } from 'react-router-dom';
import { getWorkspaceLabel } from '../../../common/get-workspace-label';
import { strings } from '../../../common/strings';
@@ -10,6 +10,7 @@ import { Modal, type ModalHandle, type ModalProps } from '../base/modal';
import { ModalBody } from '../base/modal-body';
import { ModalFooter } from '../base/modal-footer';
import { ModalHeader } from '../base/modal-header';
import { Icon } from '../icon';
interface WorkspaceDuplicateModalProps extends ModalProps {
workspace: Workspace;
@@ -20,6 +21,7 @@ export const WorkspaceDuplicateModal: FC<WorkspaceDuplicateModalProps> = ({ work
const { organizationId } = useParams<{organizationId: string}>();
const { Form } = useFetcher();
const modalRef = useRef<ModalHandle>(null);
const navigation = useNavigation();
useEffect(() => {
modalRef.current?.show();
}, []);
@@ -57,8 +59,8 @@ export const WorkspaceDuplicateModal: FC<WorkspaceDuplicateModalProps> = ({ work
</Form>
</ModalBody>
<ModalFooter>
<button type="submit" form="workspace-duplicate-form" className="btn">
Duplicate
<button type="submit" disabled={navigation.state !== 'idle'} form="workspace-duplicate-form" className="btn">
{navigation.state !== 'idle' && <Icon icon='spinner' className='animate-spin' />} Duplicate
</button>
</ModalFooter>
</Modal>