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:
Sid
2026-05-15 16:27:56 +05:30
committed by GitHub
parent bdc5d1e017
commit 48c88df3a8
5 changed files with 114 additions and 13 deletions

View File

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

View File

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

View File

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