chore(#718): collcetion presets pr review

This commit is contained in:
Anoop M D 2023-11-19 13:13:31 +05:30
parent 7367972d56
commit bd71adebe0
6 changed files with 44 additions and 88 deletions

View File

@ -2,7 +2,7 @@ import styled from 'styled-components';
const StyledWrapper = styled.div` const StyledWrapper = styled.div`
.settings-label { .settings-label {
width: 80px; width: 110px;
} }
.textbox { .textbox {

View File

@ -9,14 +9,14 @@ import cloneDeep from 'lodash/cloneDeep';
const PresetsSettings = ({ collection }) => { const PresetsSettings = ({ collection }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const { const {
brunoConfig: { presets: defaultPresets = {} } brunoConfig: { presets: presets = {} }
} = collection; } = collection;
const formik = useFormik({ const formik = useFormik({
enableReinitialize: true, enableReinitialize: true,
initialValues: { initialValues: {
defaultType: defaultPresets.defaultType || 'http-request', requestType: presets.requestType || 'http',
defaultRequestUrl: defaultPresets.defaultRequestUrl || '' requestUrl: presets.requestUrl || ''
}, },
onSubmit: (newPresets) => { onSubmit: (newPresets) => {
const brunoConfig = cloneDeep(collection.brunoConfig); const brunoConfig = cloneDeep(collection.brunoConfig);
@ -32,53 +32,53 @@ const PresetsSettings = ({ collection }) => {
<form className="bruno-form" onSubmit={formik.handleSubmit}> <form className="bruno-form" onSubmit={formik.handleSubmit}>
<div className="mb-3 flex items-center"> <div className="mb-3 flex items-center">
<label className="settings-label flex items-center" htmlFor="enabled"> <label className="settings-label flex items-center" htmlFor="enabled">
Default Request Type Request Type
</label> </label>
<div className="flex items-center mt-2"> <div className="flex items-center">
<input <input
id="http-request" id="http"
className="cursor-pointer" className="cursor-pointer"
type="radio" type="radio"
name="defaultType" name="requestType"
onChange={formik.handleChange} onChange={formik.handleChange}
value="http-request" value="http"
checked={formik.values.defaultType === 'http-request'} checked={formik.values.requestType === 'http'}
/> />
<label htmlFor="http-request" className="ml-1 cursor-pointer select-none"> <label htmlFor="http" className="ml-1 cursor-pointer select-none">
HTTP HTTP
</label> </label>
<input <input
id="graphql-request" id="graphql"
className="ml-4 cursor-pointer" className="ml-4 cursor-pointer"
type="radio" type="radio"
name="defaultType" name="requestType"
onChange={formik.handleChange} onChange={formik.handleChange}
value="graphql-request" value="graphql"
checked={formik.values.defaultType === 'graphql-request'} checked={formik.values.requestType === 'graphql'}
/> />
<label htmlFor="graphql-request" className="ml-1 cursor-pointer select-none"> <label htmlFor="graphql" className="ml-1 cursor-pointer select-none">
GraphQL GraphQL
</label> </label>
</div> </div>
</div> </div>
<div className="mb-3 flex items-center"> <div className="mb-3 flex items-center">
<label className="settings-label" htmlFor="defaultRequestUrl"> <label className="settings-label" htmlFor="requestUrl">
Default Base URL Base URL
</label> </label>
<div className="flex items-center mt-2 "> <div className="flex items-center">
<div className="flex items-center flex-grow input-container h-full"> <div className="flex items-center flex-grow input-container h-full">
<input <input
id="request-url" id="request-url"
type="text" type="text"
name="defaultRequestUrl" name="requestUrl"
className="block textbox" className="block textbox"
autoComplete="off" autoComplete="off"
autoCorrect="off" autoCorrect="off"
autoCapitalize="off" autoCapitalize="off"
spellCheck="false" spellCheck="false"
onChange={formik.handleChange} onChange={formik.handleChange}
value={formik.values.defaultRequestUrl || ''} value={formik.values.requestUrl || ''}
/> />
</div> </div>
</div> </div>

View File

@ -1,40 +0,0 @@
import styled from 'styled-components';
const StyledWrapper = styled.div`
div.method-selector-container {
border: solid 1px ${(props) => props.theme.modal.input.border};
border-right: none;
background-color: ${(props) => props.theme.modal.input.bg};
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
.method-selector {
min-width: 80px;
}
}
div.method-selector-container,
div.input-container {
background-color: ${(props) => props.theme.modal.input.bg};
height: 2.3rem;
}
div.input-container {
border: solid 1px ${(props) => props.theme.modal.input.border};
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
input {
background-color: ${(props) => props.theme.modal.input.bg};
outline: none;
box-shadow: none;
&:focus {
outline: none !important;
box-shadow: none !important;
}
}
}
`;
export default StyledWrapper;

View File

@ -19,12 +19,33 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
const { const {
brunoConfig: { presets: collectionPresets = {} } brunoConfig: { presets: collectionPresets = {} }
} = collection; } = collection;
const getRequestType = (collectionPresets) => {
if (!collectionPresets || !collectionPresets.requestType) {
return 'http-request';
}
// Note: Why different labels for the same thing?
// http-request and graphql-request are used inside the app's json representation of a request
// http and graphql are used in Bru DSL as well as collection exports
// We need to eventually standardize the app's DSL to use the same labels as bru DSL
if (collectionPresets.requestType === 'http') {
return 'http-request';
}
if (collectionPresets.requestType === 'graphql') {
return 'graphql-request';
}
return 'http-request';
};
const formik = useFormik({ const formik = useFormik({
enableReinitialize: true, enableReinitialize: true,
initialValues: { initialValues: {
requestName: '', requestName: '',
requestType: collectionPresets.defaultType || 'http-request', requestType: getRequestType(collectionPresets),
requestUrl: collectionPresets.defaultRequestUrl || '', requestUrl: collectionPresets.requestUrl || '',
requestMethod: 'GET', requestMethod: 'GET',
curlCommand: '' curlCommand: ''
}, },

View File

@ -47,22 +47,6 @@ import { resolveRequestFilename } from 'utils/common/platform';
import { parseQueryParams, splitOnFirst } from 'utils/url/index'; import { parseQueryParams, splitOnFirst } from 'utils/url/index';
import { each } from 'lodash'; import { each } from 'lodash';
export const updateCollectionPresets = (newPresets, collectionUid) => (dispatch, getState) => {
const state = getState();
const collection = findCollectionByUid(state.collections.collections, collectionUid);
return new Promise((resolve, reject) => {
if (!collection) {
return reject(new Error('Collection not found'));
}
ipcRenderer
.invoke('renderer:update-collection-presets', newPresets, collection.pathname)
.then(resolve)
.catch(reject);
});
};
export const renameCollection = (newName, collectionUid) => (dispatch, getState) => { export const renameCollection = (newName, collectionUid) => (dispatch, getState) => {
const state = getState(); const state = getState();
const collection = findCollectionByUid(state.collections.collections, collectionUid); const collection = findCollectionByUid(state.collections.collections, collectionUid);

View File

@ -1231,14 +1231,6 @@ export const collectionsSlice = createSlice({
collection.name = newName; collection.name = newName;
} }
}, },
collectionPresetsUpdatedEvent: (state, action) => {
const { collectionPathname, newPresets } = action.payload;
const collection = findCollectionByPathname(state.collections, collectionPathname);
if (collection.brunoConfig) {
collection.brunoConfig.presets = newPresets;
}
},
resetRunResults: (state, action) => { resetRunResults: (state, action) => {
const { collectionUid } = action.payload; const { collectionUid } = action.payload;
const collection = findCollectionByUid(state.collections, collectionUid); const collection = findCollectionByUid(state.collections, collectionUid);
@ -1442,7 +1434,6 @@ export const {
collectionUnlinkDirectoryEvent, collectionUnlinkDirectoryEvent,
collectionAddEnvFileEvent, collectionAddEnvFileEvent,
collectionRenamedEvent, collectionRenamedEvent,
collectionPresetsUpdatedEvent,
resetRunResults, resetRunResults,
runRequestEvent, runRequestEvent,
runFolderEvent, runFolderEvent,