Merge pull request #718 from thehorse2000/feature/add-properties-to-collections

Added properties to collections
This commit is contained in:
Anoop M D 2023-11-19 12:23:24 +05:30 committed by GitHub
commit 7367972d56
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 200 additions and 2 deletions

View File

@ -0,0 +1,27 @@
import styled from 'styled-components';
const StyledWrapper = styled.div`
.settings-label {
width: 80px;
}
.textbox {
border: 1px solid #ccc;
padding: 0.15rem 0.45rem;
box-shadow: none;
border-radius: 0px;
outline: none;
box-shadow: none;
transition: border-color ease-in-out 0.1s;
border-radius: 3px;
background-color: ${(props) => props.theme.modal.input.bg};
border: 1px solid ${(props) => props.theme.modal.input.border};
&:focus {
border: solid 1px ${(props) => props.theme.modal.input.focusBorder} !important;
outline: none !important;
}
}
`;
export default StyledWrapper;

View File

@ -0,0 +1,96 @@
import React, { useEffect } from 'react';
import { useFormik } from 'formik';
import { useDispatch } from 'react-redux';
import StyledWrapper from './StyledWrapper';
import toast from 'react-hot-toast';
import { updateBrunoConfig } from 'providers/ReduxStore/slices/collections/actions';
import cloneDeep from 'lodash/cloneDeep';
const PresetsSettings = ({ collection }) => {
const dispatch = useDispatch();
const {
brunoConfig: { presets: defaultPresets = {} }
} = collection;
const formik = useFormik({
enableReinitialize: true,
initialValues: {
defaultType: defaultPresets.defaultType || 'http-request',
defaultRequestUrl: defaultPresets.defaultRequestUrl || ''
},
onSubmit: (newPresets) => {
const brunoConfig = cloneDeep(collection.brunoConfig);
brunoConfig.presets = newPresets;
dispatch(updateBrunoConfig(brunoConfig, collection.uid));
toast.success('Collection presets updated');
}
});
return (
<StyledWrapper>
<h1 className="font-medium mb-3">Collection Presets</h1>
<form className="bruno-form" onSubmit={formik.handleSubmit}>
<div className="mb-3 flex items-center">
<label className="settings-label flex items-center" htmlFor="enabled">
Default Request Type
</label>
<div className="flex items-center mt-2">
<input
id="http-request"
className="cursor-pointer"
type="radio"
name="defaultType"
onChange={formik.handleChange}
value="http-request"
checked={formik.values.defaultType === 'http-request'}
/>
<label htmlFor="http-request" className="ml-1 cursor-pointer select-none">
HTTP
</label>
<input
id="graphql-request"
className="ml-4 cursor-pointer"
type="radio"
name="defaultType"
onChange={formik.handleChange}
value="graphql-request"
checked={formik.values.defaultType === 'graphql-request'}
/>
<label htmlFor="graphql-request" className="ml-1 cursor-pointer select-none">
GraphQL
</label>
</div>
</div>
<div className="mb-3 flex items-center">
<label className="settings-label" htmlFor="defaultRequestUrl">
Default Base URL
</label>
<div className="flex items-center mt-2 ">
<div className="flex items-center flex-grow input-container h-full">
<input
id="request-url"
type="text"
name="defaultRequestUrl"
className="block textbox"
autoComplete="off"
autoCorrect="off"
autoCapitalize="off"
spellCheck="false"
onChange={formik.handleChange}
value={formik.values.defaultRequestUrl || ''}
/>
</div>
</div>
</div>
<div className="mt-6">
<button type="submit" className="submit btn btn-sm btn-secondary">
Save
</button>
</div>
</form>
</StyledWrapper>
);
};
export default PresetsSettings;

View File

@ -13,6 +13,7 @@ import Auth from './Auth';
import Script from './Script';
import Test from './Tests';
import Docs from './Docs';
import Presets from './Presets';
import StyledWrapper from './StyledWrapper';
const CollectionSettings = ({ collection }) => {
@ -84,6 +85,9 @@ const CollectionSettings = ({ collection }) => {
case 'tests': {
return <Test collection={collection} />;
}
case 'presets': {
return <Presets collection={collection} />;
}
case 'proxy': {
return <ProxySettings proxyConfig={proxyConfig} onUpdate={onProxySettingsUpdate} />;
}
@ -123,6 +127,9 @@ const CollectionSettings = ({ collection }) => {
<div className={getTabClassname('tests')} role="tab" onClick={() => setTab('tests')}>
Tests
</div>
<div className={getTabClassname('presets')} role="tab" onClick={() => setTab('presets')}>
Presets
</div>
<div className={getTabClassname('proxy')} role="tab" onClick={() => setTab('proxy')}>
Proxy
</div>

View File

@ -0,0 +1,40 @@
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

@ -16,12 +16,15 @@ import { getRequestFromCurlCommand } from 'utils/curl';
const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
const dispatch = useDispatch();
const inputRef = useRef();
const {
brunoConfig: { presets: collectionPresets = {} }
} = collection;
const formik = useFormik({
enableReinitialize: true,
initialValues: {
requestName: '',
requestType: 'http-request',
requestUrl: '',
requestType: collectionPresets.defaultType || 'http-request',
requestUrl: collectionPresets.defaultRequestUrl || '',
requestMethod: 'GET',
curlCommand: ''
},

View File

@ -47,6 +47,22 @@ import { resolveRequestFilename } from 'utils/common/platform';
import { parseQueryParams, splitOnFirst } from 'utils/url/index';
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) => {
const state = getState();
const collection = findCollectionByUid(state.collections.collections, collectionUid);

View File

@ -1231,6 +1231,14 @@ export const collectionsSlice = createSlice({
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) => {
const { collectionUid } = action.payload;
const collection = findCollectionByUid(state.collections, collectionUid);
@ -1434,6 +1442,7 @@ export const {
collectionUnlinkDirectoryEvent,
collectionAddEnvFileEvent,
collectionRenamedEvent,
collectionPresetsUpdatedEvent,
resetRunResults,
runRequestEvent,
runFolderEvent,