extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2025-06-24 14:01:29 +02:00
Code Issues Packages Projects Releases Wiki Activity

#2757: Visualize if request body, script or tests have content (#2809)

Browse Source
This commit is contained in:
Niklas Ziermann 2024-08-19 15:07:47 +02:00 committed by GitHub
parent a1783c46ed
commit 77750ecc0b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js
View File

@ -16,6 +16,8 @@ import StyledWrapper from './StyledWrapper';
import { find, get } from 'lodash'; import { find, get } from 'lodash';
import Documentation from 'components/Documentation/index'; import Documentation from 'components/Documentation/index';
const CONTENT_INDICATOR = '\u25CF';
const HttpRequestPane = ({ item, collection, leftPaneWidth }) => { const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const tabs = useSelector((state) => state.tabs.tabs); const tabs = useSelector((state) => state.tabs.tabs);
@ -82,12 +84,17 @@ const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
const isMultipleContentTab = ['params', 'script', 'vars', 'auth', 'docs'].includes(focusedTab.requestPaneTab); const isMultipleContentTab = ['params', 'script', 'vars', 'auth', 'docs'].includes(focusedTab.requestPaneTab);
// get the length of active params, headers, asserts and vars // get the length of active params, headers, asserts and vars as well as the contents of the body, tests and script
const params = item.draft ? get(item, 'draft.request.params', []) : get(item, 'request.params', []); const getPropertyFromDraftOrRequest = (propertyKey) =>
const headers = item.draft ? get(item, 'draft.request.headers', []) : get(item, 'request.headers', []); item.draft ? get(item, `draft.${propertyKey}`, []) : get(item, propertyKey, []);
const assertions = item.draft ? get(item, 'draft.request.assertions', []) : get(item, 'request.assertions', []); const params = getPropertyFromDraftOrRequest('request.params');
const requestVars = item.draft ? get(item, 'draft.request.vars.req', []) : get(item, 'request.vars.req', []); const body = getPropertyFromDraftOrRequest('request.body');
const responseVars = item.draft ? get(item, 'draft.request.vars.res', []) : get(item, 'request.vars.res', []); const headers = getPropertyFromDraftOrRequest('request.headers');
const script = getPropertyFromDraftOrRequest('request.script');
const assertions = getPropertyFromDraftOrRequest('request.assertions');
const tests = getPropertyFromDraftOrRequest('request.tests');
const requestVars = getPropertyFromDraftOrRequest('request.vars.req');
const responseVars = getPropertyFromDraftOrRequest('request.vars.res');
const activeParamsLength = params.filter((param) => param.enabled).length; const activeParamsLength = params.filter((param) => param.enabled).length;
const activeHeadersLength = headers.filter((header) => header.enabled).length; const activeHeadersLength = headers.filter((header) => header.enabled).length;
@ -105,6 +112,7 @@ const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
</div> </div>
<div className={getTabClassname('body')} role="tab" onClick={() => selectTab('body')}> <div className={getTabClassname('body')} role="tab" onClick={() => selectTab('body')}>
Body Body
{body.mode !== 'none' && <sup className="ml-1 font-medium">{CONTENT_INDICATOR}</sup>}
</div> </div>
<div className={getTabClassname('headers')} role="tab" onClick={() => selectTab('headers')}> <div className={getTabClassname('headers')} role="tab" onClick={() => selectTab('headers')}>
Headers Headers
@ -119,6 +127,7 @@ const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
</div> </div>
<div className={getTabClassname('script')} role="tab" onClick={() => selectTab('script')}> <div className={getTabClassname('script')} role="tab" onClick={() => selectTab('script')}>
Script Script
{(script.req || script.res) && <sup className="ml-1 font-medium">{CONTENT_INDICATOR}</sup>}
</div> </div>
<div className={getTabClassname('assert')} role="tab" onClick={() => selectTab('assert')}> <div className={getTabClassname('assert')} role="tab" onClick={() => selectTab('assert')}>
Assert Assert
@ -126,6 +135,7 @@ const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
</div> </div>
<div className={getTabClassname('tests')} role="tab" onClick={() => selectTab('tests')}> <div className={getTabClassname('tests')} role="tab" onClick={() => selectTab('tests')}>
Tests Tests
{tests && <sup className="ml-1 font-medium">{CONTENT_INDICATOR}</sup>}
</div> </div>
<div className={getTabClassname('docs')} role="tab" onClick={() => selectTab('docs')}> <div className={getTabClassname('docs')} role="tab" onClick={() => selectTab('docs')}>
Docs Docs