mirror of
https://github.com/usebruno/bruno.git
synced 2026-07-09 06:55:03 +00:00
fix: handle transient requests during app quit flow in SaveRequestsModal (#8003)
* fix: handle transient requests during app quit flow in SaveRequestsModal * test: non serial * chore: fix theme * fix: ui polish * chore: import * chore: cr
This commit is contained in:
@@ -0,0 +1,21 @@
|
||||
import styled from 'styled-components';
|
||||
|
||||
const StyledWrapper = styled.div`
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
padding-left: 0.75rem;
|
||||
padding-right: 0.75rem;
|
||||
background: ${({ theme }) => theme.background.crust};
|
||||
border: 1px solid ${({ theme }) => theme.border.border0};
|
||||
border-radius: ${({ theme }) => theme.border.radius.sm};
|
||||
|
||||
.request-name {
|
||||
color: ${({ theme }) => theme.text};
|
||||
}
|
||||
|
||||
.collection-name{
|
||||
color: ${({ theme }) => theme.colors.text.subtext1};
|
||||
}
|
||||
`;
|
||||
|
||||
export default StyledWrapper;
|
||||
@@ -7,7 +7,8 @@ import { closeTabs } from 'providers/ReduxStore/slices/collections/actions';
|
||||
import toast from 'react-hot-toast';
|
||||
import Modal from 'components/Modal';
|
||||
import Button from 'ui/Button';
|
||||
import SaveTransientRequest from './index';
|
||||
import SaveTransientRequest from 'components/SaveTransientRequest';
|
||||
import StyledWrapper from './StyledWrapper';
|
||||
|
||||
const SaveTransientRequestContainer = () => {
|
||||
const dispatch = useDispatch();
|
||||
@@ -86,13 +87,13 @@ const SaveTransientRequestContainer = () => {
|
||||
{modals.map((modal) => {
|
||||
const { item, collection } = modal;
|
||||
return (
|
||||
<div
|
||||
<StyledWrapper
|
||||
key={item.uid}
|
||||
className="flex items-center justify-between py-2 px-3 bg-gray-50 rounded border border-gray-200"
|
||||
className="flex items-center justify-between"
|
||||
>
|
||||
<div className="flex flex-col flex-1 min-w-0 mr-3">
|
||||
<span className="text-sm text-gray-700 truncate">{item.name}</span>
|
||||
<span className="text-xs text-gray-500 truncate">
|
||||
<span className="text-sm request-name truncate">{item.name}</span>
|
||||
<span className="text-xs collection-name truncate">
|
||||
{collection.name}
|
||||
</span>
|
||||
</div>
|
||||
@@ -105,13 +106,13 @@ const SaveTransientRequestContainer = () => {
|
||||
>
|
||||
Save
|
||||
</Button>
|
||||
</div>
|
||||
</StyledWrapper>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end mt-6 pt-4 border-t">
|
||||
<div className="flex justify-end mt-6 pt-4">
|
||||
<Button color="danger" onClick={handleDiscardAll}>
|
||||
Discard All
|
||||
</Button>
|
||||
@@ -358,6 +358,8 @@ const SaveTransientRequest = ({ item: itemProp, collection: collectionProp, isOp
|
||||
return null;
|
||||
}
|
||||
|
||||
const showNewFolderFooterButton = !showNewFolderInput && !isSelectingCollection && (filteredFolders.length > 0 && !searchText.trim());
|
||||
|
||||
return (
|
||||
<StyledWrapper>
|
||||
<Modal
|
||||
@@ -539,7 +541,7 @@ const SaveTransientRequest = ({ item: itemProp, collection: collectionProp, isOp
|
||||
size="sm"
|
||||
onClick={handleCreateNewCollection}
|
||||
>
|
||||
Save
|
||||
Create
|
||||
</Button>
|
||||
</div>
|
||||
</li>
|
||||
@@ -736,7 +738,20 @@ const SaveTransientRequest = ({ item: itemProp, collection: collectionProp, isOp
|
||||
</ul>
|
||||
) : (
|
||||
<div className="folder-empty-state">
|
||||
{searchText.trim() ? 'No folders found' : 'No folders available'}
|
||||
<div className="flex flex-col items-center">
|
||||
<span>
|
||||
{searchText.trim() ? 'No folders found' : 'No folders available' }
|
||||
</span>
|
||||
<Button
|
||||
type="button"
|
||||
color="primary"
|
||||
variant="ghost"
|
||||
icon={<IconFolder size={16} strokeWidth={1.5} />}
|
||||
onClick={handleShowNewFolder}
|
||||
>
|
||||
New Folder
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -747,7 +762,7 @@ const SaveTransientRequest = ({ item: itemProp, collection: collectionProp, isOp
|
||||
|
||||
<div className="custom-modal-footer">
|
||||
<div className="footer-left">
|
||||
{!showNewFolderInput && !isSelectingCollection && (
|
||||
{showNewFolderFooterButton && (
|
||||
<Button
|
||||
type="button"
|
||||
color="primary"
|
||||
|
||||
Reference in New Issue
Block a user