rayan/bruno
1
0
Fork 0
mirror of https://github.com/usebruno/bruno.git synced 2026-06-25 21:55:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: improved item info ux

Browse Source
This commit is contained in:
Anoop M D
2025-03-18 19:46:31 +05:30
parent 1009d42f92
commit d74121986a
5 changed files with 45 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js
View File

@@ -73,7 +73,7 @@ const CloneCollectionItem = ({ collection, item, onClose }) => {
className="btn-advanced"
type="button"
>
Advanced
Options
</button>
<IconCaretDown className="caret ml-1" size={14} strokeWidth={2}/>
</div>

64
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CollectionItemInfo/index.js
View File

@@ -1,11 +1,10 @@
import React from 'react';
import Modal from 'components/Modal';
import path from 'utils/common/path';
import Help from 'components/Help';
const CollectionItemInfo = ({ item, onClose }) => {
const { name, filename, type } = item;
const CollectionItemInfo = ({ collection, item, onClose }) => {
const { pathname: collectionPathname } = collection;
const { name, filename, pathname, type } = item;
const relativePathname = path.relative(collectionPathname, pathname);
return (
<Modal
size="md"
@@ -14,24 +13,43 @@ const CollectionItemInfo = ({ collection, item, onClose }) => {
hideCancel={true}
hideFooter={true}
>
<div className="w-fit flex flex-col h-full">
<table className="w-full border-collapse">
<tbody>
<tr className="">
<td className="py-2 px-2 text-right opacity-50">Name&nbsp;:</td>
<td className="py-2 px-2 text-nowrap truncate max-w-[500px]" title={name}>{name}</td>
</tr>
<tr className="">
<td className="py-2 px-2 text-right opacity-50">{type=='folder' ? 'Folder Name' : 'File Name'}&nbsp;:</td>
<td className="py-2 px-2 break-all text-nowrap truncate max-w-[500px]" title={filename}>{filename}</td>
</tr>
<tr className="">
<td className="py-2 px-2 text-right opacity-50">Pathname&nbsp;:</td>
<td className="py-2 px-2 break-all text-nowrap truncate max-w-[500px]" title={relativePathname}>{relativePathname}</td>
</tr>
</tbody>
</table>
</div>
<div className="w-fit flex flex-col h-full">
<table className="w-full border-collapse">
<tbody>
<tr className="">
<td className="py-2 px-2 text-left text-muted ">
{type=='folder' ? 'Folder Name' : 'Request Name'}
</td>
<td className="py-2 px-2 text-nowrap truncate max-w-[500px]" title={name}>
<span className="mr-2">:</span>{name}
</td>
</tr>
<tr className="">
<td className="py-2 px-2 text-left text-muted flex items-center">
{type == 'folder' ? 'Folder Name' : 'File Name'}
<small className='font-normal text-muted ml-1'>(on filesystem)</small>
{type == 'folder' ? (
<Help width="300">
<p>
The name of the folder on your filesystem.
</p>
</Help>
) : (
<Help width="300">
<p>
Bruno saves each request as a file in your collection's folder.
</p>
</Help>
)}
</td>
<td className="py-2 px-2 break-all text-nowrap truncate max-w-[500px]" title={filename}>
<span className="mr-2">:</span>
{filename}
</td>
</tr>
</tbody>
</table>
</div>
</Modal>
);
};

2
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js
View File

@@ -93,7 +93,7 @@ const RenameCollectionItem = ({ collection, item, onClose }) => {
className="btn-advanced"
type="button"
>
Advanced
Options
</button>
<IconCaretDown className="caret ml-1" size={14} strokeWidth={2}/>
</div>

2
packages/bruno-app/src/components/Sidebar/NewFolder/index.js
View File

@@ -74,7 +74,7 @@ const NewFolder = ({ collection, item, onClose }) => {
className="btn-advanced"
type="button"
>
Advanced
Options
</button>
<IconCaretDown className="caret ml-1" size={14} strokeWidth={2}/>
</div>

2
packages/bruno-app/src/components/Sidebar/NewRequest/index.js
View File

@@ -243,7 +243,7 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
className="btn-advanced"
type="button"
>
Advanced
Options
</button>
<IconCaretDown className="caret ml-1" size={14} strokeWidth={2}/>
</div>