mirror of
https://github.com/usebruno/bruno.git
synced 2025-02-16 17:51:48 +01:00
Revert "Feat table resize and reorder (#2641)" on screen QueryParams
This partially reverts commit 2191550061
.
This commit is contained in:
parent
53d404f649
commit
f80d7ff224
@ -22,12 +22,14 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
td {
|
td {
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
}
|
|
||||||
|
&:nth-child(1) {
|
||||||
|
width: 30%;
|
||||||
}
|
}
|
||||||
|
|
||||||
td {
|
&:nth-child(3) {
|
||||||
&:nth-child(1) {
|
width: 70px;
|
||||||
padding: 0 0 0 8px;
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -7,17 +7,14 @@ import { useDispatch } from 'react-redux';
|
|||||||
import { useTheme } from 'providers/Theme';
|
import { useTheme } from 'providers/Theme';
|
||||||
import {
|
import {
|
||||||
addQueryParam,
|
addQueryParam,
|
||||||
updateQueryParam,
|
|
||||||
deleteQueryParam,
|
deleteQueryParam,
|
||||||
moveQueryParam,
|
updatePathParam,
|
||||||
updatePathParam
|
updateQueryParam
|
||||||
} from 'providers/ReduxStore/slices/collections';
|
} from 'providers/ReduxStore/slices/collections';
|
||||||
import SingleLineEditor from 'components/SingleLineEditor';
|
import SingleLineEditor from 'components/SingleLineEditor';
|
||||||
import { saveRequest, sendRequest } from 'providers/ReduxStore/slices/collections/actions';
|
import { saveRequest, sendRequest } from 'providers/ReduxStore/slices/collections/actions';
|
||||||
|
|
||||||
import StyledWrapper from './StyledWrapper';
|
import StyledWrapper from './StyledWrapper';
|
||||||
import Table from 'components/Table/index';
|
|
||||||
import ReorderTable from 'components/ReorderTable';
|
|
||||||
|
|
||||||
const QueryParams = ({ item, collection }) => {
|
const QueryParams = ({ item, collection }) => {
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
@ -103,33 +100,24 @@ const QueryParams = ({ item, collection }) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleParamDrag = ({ updateReorderedItem }) => {
|
|
||||||
dispatch(
|
|
||||||
moveQueryParam({
|
|
||||||
collectionUid: collection.uid,
|
|
||||||
itemUid: item.uid,
|
|
||||||
updateReorderedItem
|
|
||||||
})
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<StyledWrapper className="w-full flex flex-col absolute">
|
<StyledWrapper className="w-full flex flex-col">
|
||||||
<div className="flex-1 mt-2">
|
<div className="flex-1 mt-2">
|
||||||
<div className="mb-1 title text-xs">Query</div>
|
<div className="mb-2 title text-xs">Query</div>
|
||||||
|
<table>
|
||||||
<Table
|
<thead>
|
||||||
headers={[
|
<tr>
|
||||||
{ name: 'Name', accessor: 'name', width: '31%' },
|
<td>Name</td>
|
||||||
{ name: 'Path', accessor: 'path', width: '56%' },
|
<td>Value</td>
|
||||||
{ name: '', accessor: '', width: '13%' }
|
<td></td>
|
||||||
]}
|
</tr>
|
||||||
>
|
</thead>
|
||||||
<ReorderTable updateReorderedItem={handleParamDrag}>
|
<tbody>
|
||||||
{queryParams && queryParams.length
|
{queryParams && queryParams.length
|
||||||
? queryParams.map((param, index) => (
|
? queryParams.map((param, index) => {
|
||||||
<tr key={param.uid} data-uid={param.uid}>
|
return (
|
||||||
<td className="flex relative">
|
<tr key={param.uid}>
|
||||||
|
<td>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
autoComplete="off"
|
autoComplete="off"
|
||||||
@ -146,10 +134,20 @@ const QueryParams = ({ item, collection }) => {
|
|||||||
value={param.value}
|
value={param.value}
|
||||||
theme={storedTheme}
|
theme={storedTheme}
|
||||||
onSave={onSave}
|
onSave={onSave}
|
||||||
onChange={(newValue) => handleQueryParamChange({ target: { value: newValue } }, param, 'value')}
|
onChange={(newValue) =>
|
||||||
|
handleQueryParamChange(
|
||||||
|
{
|
||||||
|
target: {
|
||||||
|
value: newValue
|
||||||
|
}
|
||||||
|
},
|
||||||
|
param,
|
||||||
|
'value'
|
||||||
|
)
|
||||||
|
}
|
||||||
onRun={handleRun}
|
onRun={handleRun}
|
||||||
collection={collection}
|
collection={collection}
|
||||||
variablesAutocomplete={true}
|
item={item}
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
@ -167,11 +165,11 @@ const QueryParams = ({ item, collection }) => {
|
|||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
))
|
);
|
||||||
|
})
|
||||||
: null}
|
: null}
|
||||||
</ReorderTable>
|
</tbody>
|
||||||
</Table>
|
</table>
|
||||||
|
|
||||||
<button className="btn-add-param text-link pr-2 py-3 mt-2 select-none" onClick={handleAddQueryParam}>
|
<button className="btn-add-param text-link pr-2 py-3 mt-2 select-none" onClick={handleAddQueryParam}>
|
||||||
+ <span>Add Param</span>
|
+ <span>Add Param</span>
|
||||||
</button>
|
</button>
|
||||||
|
Loading…
Reference in New Issue
Block a user