diff --git a/packages/bruno-app/.prettierrc.json b/packages/bruno-app/.prettierrc.json new file mode 100644 index 000000000..c91533e88 --- /dev/null +++ b/packages/bruno-app/.prettierrc.json @@ -0,0 +1,7 @@ +{ + "trailingComma": "none", + "tabWidth": 2, + "semi": true, + "singleQuote": true, + "printWidth": 180 +} diff --git a/packages/bruno-app/package.json b/packages/bruno-app/package.json index cd96ff19f..33860b017 100644 --- a/packages/bruno-app/package.json +++ b/packages/bruno-app/package.json @@ -5,16 +5,17 @@ "dev": "next dev", "build": "next build && next export", "start": "next start", - "lint": "next lint" + "lint": "next lint", + "prettier": "prettier --write \"./src/**/*.{js,jsx,json,ts,tsx}\"" }, "dependencies": { - "@usebruno/schema": "0.1.0", "@fortawesome/fontawesome-svg-core": "^1.2.36", "@fortawesome/free-solid-svg-icons": "^5.15.4", "@fortawesome/react-fontawesome": "^0.1.16", "@reduxjs/toolkit": "^1.8.0", "@tabler/icons": "^1.46.0", "@tippyjs/react": "^4.2.6", + "@usebruno/schema": "0.1.0", "axios": "^0.26.0", "classnames": "^2.3.1", "codemirror": "^5.65.2", @@ -57,6 +58,7 @@ "html-loader": "^3.0.1", "html-webpack-plugin": "^5.5.0", "mini-css-extract-plugin": "^2.4.5", + "prettier": "^2.7.1", "style-loader": "^3.3.1", "webpack": "^5.64.4", "webpack-cli": "^4.9.1" diff --git a/packages/bruno-app/src/api/auth.js b/packages/bruno-app/src/api/auth.js index 50284065e..4cdb73044 100644 --- a/packages/bruno-app/src/api/auth.js +++ b/packages/bruno-app/src/api/auth.js @@ -6,17 +6,18 @@ const AuthApi = { signup: (params) => post('auth/v1/user/signup', params), login: (params) => { return new Promise((resolve, reject) => { - const { ipcRenderer } = window.require("electron"); + const { ipcRenderer } = window.require('electron'); - ipcRenderer.invoke('bruno-account-request', { - data: params, - method: 'POST', - url: `${process.env.NEXT_PUBLIC_BRUNO_SERVER_API}/auth/v1/user/login`, - }) - .then(resolve) - .catch(reject); + ipcRenderer + .invoke('bruno-account-request', { + data: params, + method: 'POST', + url: `${process.env.NEXT_PUBLIC_BRUNO_SERVER_API}/auth/v1/user/login` + }) + .then(resolve) + .catch(reject); }); } }; -export default AuthApi; \ No newline at end of file +export default AuthApi; diff --git a/packages/bruno-app/src/api/base.js b/packages/bruno-app/src/api/base.js index 85a02cd35..6dbdcedbe 100644 --- a/packages/bruno-app/src/api/base.js +++ b/packages/bruno-app/src/api/base.js @@ -1,22 +1,25 @@ -import axios from "axios"; +import axios from 'axios'; const apiClient = axios.create({ baseURL: process.env.NEXT_PUBLIC_GRAFNODE_SERVER_API }); -apiClient.interceptors.request.use((config) => { - const headers = { - 'Content-Type': 'application/json' - }; +apiClient.interceptors.request.use( + (config) => { + const headers = { + 'Content-Type': 'application/json' + }; - return ({ - ...config, - headers: headers - }); -}, error => Promise.reject(error)); + return { + ...config, + headers: headers + }; + }, + (error) => Promise.reject(error) +); -apiClient.interceptors.response.use((response) => - response, +apiClient.interceptors.response.use( + (response) => response, async (error) => { return Promise.reject(error.response ? error.response.data : error); } diff --git a/packages/bruno-app/src/components/Bruno/index.js b/packages/bruno-app/src/components/Bruno/index.js index 674b5f0e3..4eccc7026 100644 --- a/packages/bruno-app/src/components/Bruno/index.js +++ b/packages/bruno-app/src/components/Bruno/index.js @@ -1,30 +1,94 @@ import React from 'react'; -const Bruno = ({width}) => { +const Bruno = ({ width }) => { return ( - - - + + + - - - + + + - - - - - - - - - - + + + + + + + + + + - ) + ); }; export default Bruno; diff --git a/packages/bruno-app/src/components/BrunoSupport/index.js b/packages/bruno-app/src/components/BrunoSupport/index.js index 116d94500..95d4c5cbd 100644 --- a/packages/bruno-app/src/components/BrunoSupport/index.js +++ b/packages/bruno-app/src/components/BrunoSupport/index.js @@ -1,40 +1,36 @@ -import React from "react"; -import Modal from "components/Modal/index"; -import {IconSpeakerphone, IconBrandTwitter} from "@tabler/icons"; -import StyledWrapper from "./StyledWrapper"; +import React from 'react'; +import Modal from 'components/Modal/index'; +import { IconSpeakerphone, IconBrandTwitter } from '@tabler/icons'; +import StyledWrapper from './StyledWrapper'; import GithubSvg from 'assets/github.svg'; -const BrunoSupport = ({onClose}) => { +const BrunoSupport = ({ onClose }) => { return ( - +
- Report Issues + + Report Issues
- + Github
- Twitter + + Twitter
); -} +}; export default BrunoSupport; - diff --git a/packages/bruno-app/src/components/CodeEditor/StyledWrapper.js b/packages/bruno-app/src/components/CodeEditor/StyledWrapper.js index eefb1f917..29eaa74c6 100644 --- a/packages/bruno-app/src/components/CodeEditor/StyledWrapper.js +++ b/packages/bruno-app/src/components/CodeEditor/StyledWrapper.js @@ -11,4 +11,3 @@ const StyledWrapper = styled.div` `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/CodeEditor/index.js b/packages/bruno-app/src/components/CodeEditor/index.js index 721e75904..61fb0e66c 100644 --- a/packages/bruno-app/src/components/CodeEditor/index.js +++ b/packages/bruno-app/src/components/CodeEditor/index.js @@ -37,33 +37,33 @@ export default class QueryEditor extends React.Component { matchBrackets: true, showCursorWhenSelecting: true, foldGutter: true, - gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"], + gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'], readOnly: this.props.readOnly ? 'nocursor' : false, extraKeys: { 'Cmd-Enter': () => { - if(this.props.onRun) { + if (this.props.onRun) { this.props.onRun(); } }, 'Ctrl-Enter': () => { - if(this.props.onRun) { + if (this.props.onRun) { this.props.onRun(); } }, 'Cmd-S': () => { - if(this.props.onSave) { + if (this.props.onSave) { this.props.onSave(); } }, 'Ctrl-S': () => { - if(this.props.onSave) { + if (this.props.onSave) { this.props.onSave(); } }, - 'Tab': function(cm){ - cm.replaceSelection(" " , "end"); + Tab: function (cm) { + cm.replaceSelection(' ', 'end'); } - }, + } })); if (editor) { editor.on('change', this._onEdit); @@ -82,14 +82,10 @@ export default class QueryEditor extends React.Component { this.editor.options.jump.schema = this.props.schema; CodeMirror.signal(this.editor, 'change', this.editor); } - if ( - this.props.value !== prevProps.value && - this.props.value !== this.cachedValue && - this.editor - ) { + if (this.props.value !== prevProps.value && this.props.value !== this.cachedValue && this.editor) { this.cachedValue = this.props.value; this.editor.setValue(this.props.value); - this.editor.setOption("mode", this.props.mode); + this.editor.setOption('mode', this.props.mode); } this.ignoreChangeEvent = false; } @@ -106,7 +102,7 @@ export default class QueryEditor extends React.Component { { + ref={(node) => { this._node = node; }} /> diff --git a/packages/bruno-app/src/components/Dropdown/StyledWrapper.js b/packages/bruno-app/src/components/Dropdown/StyledWrapper.js index e314363bf..168f8b2f8 100644 --- a/packages/bruno-app/src/components/Dropdown/StyledWrapper.js +++ b/packages/bruno-app/src/components/Dropdown/StyledWrapper.js @@ -24,13 +24,13 @@ const Wrapper = styled.div` .label-item { display: flex; align-items: center; - padding: .35rem .6rem; + padding: 0.35rem 0.6rem; } .dropdown-item { display: flex; align-items: center; - padding: .35rem .6rem; + padding: 0.35rem 0.6rem; cursor: pointer; &:hover { diff --git a/packages/bruno-app/src/components/Dropdown/index.js b/packages/bruno-app/src/components/Dropdown/index.js index 9ed14e75f..0de0d26b5 100644 --- a/packages/bruno-app/src/components/Dropdown/index.js +++ b/packages/bruno-app/src/components/Dropdown/index.js @@ -2,19 +2,10 @@ import React from 'react'; import Tippy from '@tippyjs/react'; import StyledWrapper from './StyledWrapper'; -const Dropdown = ({icon, children, onCreate, placement}) => { +const Dropdown = ({ icon, children, onCreate, placement }) => { return ( - + {icon} diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js index 51e705119..9cc749166 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js @@ -3,68 +3,77 @@ import find from 'lodash/find'; import Dropdown from 'components/Dropdown'; import { selectEnvironment } from 'providers/ReduxStore/slices/collections/actions'; import { IconSettings, IconCaretDown, IconDatabase } from '@tabler/icons'; -import EnvironmentSettings from "../EnvironmentSettings"; +import EnvironmentSettings from '../EnvironmentSettings'; import toast from 'react-hot-toast'; import { useDispatch } from 'react-redux'; import StyledWrapper from './StyledWrapper'; -const EnvironmentSelector = ({collection}) => { +const EnvironmentSelector = ({ collection }) => { const dispatch = useDispatch(); const dropdownTippyRef = useRef(); const [openSettingsModal, setOpenSettingsModal] = useState(false); const { environments, activeEnvironmentUid } = collection; - const activeEnvironment = activeEnvironmentUid ? find(environments, e => e.uid === activeEnvironmentUid) : null; + const activeEnvironment = activeEnvironmentUid ? find(environments, (e) => e.uid === activeEnvironmentUid) : null; const Icon = forwardRef((props, ref) => { return (
{activeEnvironment ? activeEnvironment.name : 'No Environment'} - +
); }); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const onSelect = (environment) => { dispatch(selectEnvironment(environment ? environment.uid : null, collection.uid)) .then(() => { - if(environment) { + if (environment) { toast.success(`Environment changed to ${environment.name}`); } else { toast.success(`No Environments are active now`); } }) - .catch((err) => console.log(err) && toast.error("An error occured while selecting the environment")); + .catch((err) => console.log(err) && toast.error('An error occured while selecting the environment')); }; return (
- } placement='bottom-end'> - {(environments && environments.length) ? environments.map((e) => ( -
{ - onSelect(e); + } placement="bottom-end"> + {environments && environments.length + ? environments.map((e) => ( +
{ + onSelect(e); + dropdownTippyRef.current.hide(); + }} + > + {e.name} +
+ )) + : null} +
{ dropdownTippyRef.current.hide(); - }}> - {e.name} -
- )) : null} -
{ - dropdownTippyRef.current.hide(); - onSelect(null); - }}> + onSelect(null); + }} + > No Environment
-
setOpenSettingsModal(true)}> +
setOpenSettingsModal(true)}>
- +
Settings
- {openSettingsModal && setOpenSettingsModal(false)}/>} + {openSettingsModal && setOpenSettingsModal(false)} />} ); }; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/CreateEnvironment/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/CreateEnvironment/index.js index 885d901c1..6c22da0c5 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/CreateEnvironment/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/CreateEnvironment/index.js @@ -1,75 +1,70 @@ import React, { useEffect, useRef } from 'react'; -import Portal from "components/Portal/index"; -import Modal from "components/Modal/index"; +import Portal from 'components/Portal/index'; +import Modal from 'components/Modal/index'; import toast from 'react-hot-toast'; import { useFormik } from 'formik'; import { addEnvironment } from 'providers/ReduxStore/slices/collections/actions'; import * as Yup from 'yup'; import { useDispatch } from 'react-redux'; -const CreateEnvironment = ({collection, onClose}) => { +const CreateEnvironment = ({ collection, onClose }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { - name: "" + name: '' }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(addEnvironment(values.name, collection.uid)) .then(() => { - toast.success("Environment created in collection"); + toast.success('Environment created in collection'); onClose(); }) - .catch(() => toast.error("An error occured while created the environment")); + .catch(() => toast.error('An error occured while created the environment')); } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); const onSubmit = () => { formik.handleSubmit(); - } + }; return ( - +
- + - {formik.touched.name && formik.errors.name ? ( -
{formik.errors.name}
- ) : null} + {formik.touched.name && formik.errors.name ?
{formik.errors.name}
: null}
- + ); -} +}; export default CreateEnvironment; - diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/DeleteEnvironment/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/DeleteEnvironment/index.js index c4cc0cb69..9a18d2388 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/DeleteEnvironment/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/DeleteEnvironment/index.js @@ -1,39 +1,31 @@ import React from 'react'; -import Portal from "components/Portal/index"; +import Portal from 'components/Portal/index'; import toast from 'react-hot-toast'; -import Modal from "components/Modal/index"; +import Modal from 'components/Modal/index'; import { deleteEnvironment } from 'providers/ReduxStore/slices/collections/actions'; import { useDispatch } from 'react-redux'; import StyledWrapper from './StyledWrapper'; -const DeleteEnvironment = ({onClose, environment, collection}) => { +const DeleteEnvironment = ({ onClose, environment, collection }) => { const dispatch = useDispatch(); - const onConfirm = () =>{ + const onConfirm = () => { dispatch(deleteEnvironment(environment.uid, collection.uid)) .then(() => { - toast.success("Environment deleted successfully"); + toast.success('Environment deleted successfully'); onClose(); }) - .catch(() => toast.error("An error occured while deleting the environment")); + .catch(() => toast.error('An error occured while deleting the environment')); }; return ( - + Are you sure you want to delete {environment.name} ? - ); -} +}; export default DeleteEnvironment; - diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js index 279e3b9c4..84fc53d91 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js @@ -6,7 +6,8 @@ const Wrapper = styled.div` border-collapse: collapse; font-weight: 600; - thead, td { + thead, + td { border: 1px solid #efefef; } @@ -24,18 +25,18 @@ const Wrapper = styled.div` font-size: 0.8125rem; } - input[type="text"] { + input[type='text'] { width: 100%; border: solid 1px transparent; outline: none !important; - &:focus{ + &:focus { outline: none !important; border: solid 1px transparent; } } - input[type="checkbox"] { + input[type='checkbox'] { cursor: pointer; position: relative; top: 1px; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js index ca50653b6..bda2782a6 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js @@ -7,23 +7,20 @@ import { saveEnvironment } from 'providers/ReduxStore/slices/collections/actions import reducer from './reducer'; import StyledWrapper from './StyledWrapper'; -const EnvironmentVariables = ({environment, collection}) => { +const EnvironmentVariables = ({ environment, collection }) => { const dispatch = useDispatch(); - const [state, reducerDispatch] = useReducer(reducer, {hasChanges: false, variables: environment.variables || []}); - const { - variables, - hasChanges - } = state; + const [state, reducerDispatch] = useReducer(reducer, { hasChanges: false, variables: environment.variables || [] }); + const { variables, hasChanges } = state; const saveChanges = () => { dispatch(saveEnvironment(cloneDeep(variables), environment.uid, collection.uid)) .then(() => { - toast.success("Changes saved successfully"); + toast.success('Changes saved successfully'); reducerDispatch({ type: 'CHANGES_SAVED' }); }) - .catch(() => toast.error("An error occured while saving the changes")); + .catch(() => toast.error('An error occured while saving the changes')); }; const addVariable = () => { @@ -34,16 +31,16 @@ const EnvironmentVariables = ({environment, collection}) => { const handleVarChange = (e, _variable, type) => { const variable = cloneDeep(_variable); - switch(type) { - case 'name' : { + switch (type) { + case 'name': { variable.name = e.target.value; break; } - case 'value' : { + case 'value': { variable.value = e.target.value; break; } - case 'enabled' : { + case 'enabled': { variable.enabled = e.target.checked; break; } @@ -53,14 +50,14 @@ const EnvironmentVariables = ({environment, collection}) => { variable }); }; - + const handleRemoveVars = (variable) => { reducerDispatch({ type: 'DELETE_VAR', variable }); }; - + return ( @@ -72,48 +69,53 @@ const EnvironmentVariables = ({environment, collection}) => { - {variables && variables.length ? variables.map((variable, index) => { - return ( - - - - - - ); - }) : null} + {variables && variables.length + ? variables.map((variable, index) => { + return ( + + + + + + ); + }) + : null}
- handleVarChange(e, variable, 'name')} - /> - - handleVarChange(e, variable, 'value')} - /> - -
- handleVarChange(e, variable, 'enabled')} - /> - -
-
+ handleVarChange(e, variable, 'name')} + /> + + handleVarChange(e, variable, 'value')} + /> + +
+ handleVarChange(e, variable, 'enabled')} /> + +
+
- +
@@ -122,6 +124,6 @@ const EnvironmentVariables = ({environment, collection}) => {
- ) + ); }; -export default EnvironmentVariables; \ No newline at end of file +export default EnvironmentVariables; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/reducer.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/reducer.js index 5b2457ea5..c72bf7b24 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/reducer.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/reducer.js @@ -20,7 +20,7 @@ const reducer = (state, action) => { case 'UPDATE_VAR': { return produce(state, (draft) => { - const variable = find(draft.variables, (v) => v.uid === action.variable.uid); + const variable = find(draft.variables, (v) => v.uid === action.variable.uid); variable.name = action.variable.name; variable.value = action.variable.value; variable.enabled = action.variable.enabled; @@ -47,4 +47,4 @@ const reducer = (state, action) => { } }; -export default reducer; \ No newline at end of file +export default reducer; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/index.js index 1b2beafeb..a2dc02624 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/index.js @@ -1,34 +1,33 @@ -import React, {useState } from "react"; -import { IconEdit, IconTrash, IconDatabase } from "@tabler/icons"; +import React, { useState } from 'react'; +import { IconEdit, IconTrash, IconDatabase } from '@tabler/icons'; import EnvironmentVariables from './EnvironmentVariables'; -import RenameEnvironment from "../../RenameEnvironment"; -import DeleteEnvironment from "../../DeleteEnvironment"; +import RenameEnvironment from '../../RenameEnvironment'; +import DeleteEnvironment from '../../DeleteEnvironment'; -const EnvironmentDetails = ({environment, collection}) => { - const [ openEditModal, setOpenEditModal] = useState(false); - const [ openDeleteModal, setOpenDeleteModal] = useState(false); +const EnvironmentDetails = ({ environment, collection }) => { + const [openEditModal, setOpenEditModal] = useState(false); + const [openDeleteModal, setOpenDeleteModal] = useState(false); console.log(environment); return ( -
- {openEditModal && setOpenEditModal(false)} environment={environment} collection={collection}/>} - {openDeleteModal && setOpenDeleteModal(false)} environment={environment} collection={collection}/>} +
+ {openEditModal && setOpenEditModal(false)} environment={environment} collection={collection} />} + {openDeleteModal && setOpenDeleteModal(false)} environment={environment} collection={collection} />}
- + {environment.name}
- setOpenEditModal(true)}/> - setOpenDeleteModal(true)}/> + setOpenEditModal(true)} /> + setOpenDeleteModal(true)} />
- +
- ); }; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js index 4c7ce038c..c08e88776 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js @@ -1,4 +1,4 @@ -import styled from "styled-components"; +import styled from 'styled-components'; const StyledWrapper = styled.div` margin-inline: -1rem; @@ -17,7 +17,7 @@ const StyledWrapper = styled.div` padding: 8px 10px; border-left: solid 2px transparent; text-decoration: none; - + &:hover { text-decoration: none; background-color: #e4e4e4; @@ -46,4 +46,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js index c3d0cc8b3..02034f661 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js @@ -1,9 +1,9 @@ -import React, { useEffect, useState, forwardRef, useRef } from "react"; -import EnvironmentDetails from "./EnvironmentDetails"; -import CreateEnvironment from "../CreateEnvironment/index"; -import StyledWrapper from "./StyledWrapper"; +import React, { useEffect, useState, forwardRef, useRef } from 'react'; +import EnvironmentDetails from './EnvironmentDetails'; +import CreateEnvironment from '../CreateEnvironment/index'; +import StyledWrapper from './StyledWrapper'; -const EnvironmentList = ({collection}) => { +const EnvironmentList = ({ collection }) => { const { environments } = collection; const [selectedEnvironment, setSelectedEnvironment] = useState(null); const [openCreateModal, setOpenCreateModal] = useState(false); @@ -12,31 +12,29 @@ const EnvironmentList = ({collection}) => { setSelectedEnvironment(environments[0]); }, []); - if(!selectedEnvironment) { + if (!selectedEnvironment) { return null; } return ( - {openCreateModal && setOpenCreateModal(false)}/>} + {openCreateModal && setOpenCreateModal(false)} />}
- {environments && environments.length && environments.map((env) => ( -
setSelectedEnvironment(env)} - > - {env.name} -
- ))} + {environments && + environments.length && + environments.map((env) => ( +
setSelectedEnvironment(env)}> + {env.name} +
+ ))}
setOpenCreateModal(true)}> + Create
- +
); diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/RenameEnvironment/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/RenameEnvironment/index.js index 1811aa44a..f67496680 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/RenameEnvironment/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/RenameEnvironment/index.js @@ -1,75 +1,70 @@ import React, { useEffect, useRef } from 'react'; -import Portal from "components/Portal/index"; -import Modal from "components/Modal/index"; +import Portal from 'components/Portal/index'; +import Modal from 'components/Modal/index'; import toast from 'react-hot-toast'; import { useFormik } from 'formik'; import { renameEnvironment } from 'providers/ReduxStore/slices/collections/actions'; import * as Yup from 'yup'; import { useDispatch } from 'react-redux'; -const RenameEnvironment = ({onClose, environment, collection}) => { +const RenameEnvironment = ({ onClose, environment, collection }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { name: environment.name }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(renameEnvironment(values.name, environment.uid, collection.uid)) .then(() => { - toast.success("Environment renamed successfully"); + toast.success('Environment renamed successfully'); onClose(); }) - .catch(() => toast.error("An error occured while renaming the environment")); + .catch(() => toast.error('An error occured while renaming the environment')); } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); const onSubmit = () => { formik.handleSubmit(); - } + }; return ( - +
- + - {formik.touched.name && formik.errors.name ? ( -
{formik.errors.name}
- ) : null} + {formik.touched.name && formik.errors.name ?
{formik.errors.name}
: null}
- + ); -} +}; export default RenameEnvironment; - diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/StyledWrapper.js index 14e04bb5c..2dfad0cfe 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/StyledWrapper.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/StyledWrapper.js @@ -1,4 +1,4 @@ -import styled from "styled-components"; +import styled from 'styled-components'; const StyledWrapper = styled.div` button.btn-create-environment { @@ -10,4 +10,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/index.js index 6cb08cd79..11afce987 100644 --- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/index.js +++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/index.js @@ -1,50 +1,34 @@ -import Modal from "components/Modal/index"; -import React, { useState } from "react"; -import CreateEnvironment from "./CreateEnvironment"; -import EnvironmentList from "./EnvironmentList"; -import StyledWrapper from "./StyledWrapper"; +import Modal from 'components/Modal/index'; +import React, { useState } from 'react'; +import CreateEnvironment from './CreateEnvironment'; +import EnvironmentList from './EnvironmentList'; +import StyledWrapper from './StyledWrapper'; -const EnvironmentSettings = ({collection, onClose}) => { - const { environments } = collection; - const [openCreateModal, setOpenCreateModal] = useState(false) +const EnvironmentSettings = ({ collection, onClose }) => { + const { environments } = collection; + const [openCreateModal, setOpenCreateModal] = useState(false); - if(!environments || !environments.length) { - return ( - - - {openCreateModal && setOpenCreateModal(false)}/>} -
-

No environments found!

- -
- - - ) - } + if (!environments || !environments.length) { + return ( + + + {openCreateModal && setOpenCreateModal(false)} />} +
+

No environments found!

+ +
+ + + ); + } return ( - - + + - ) - -} + ); +}; export default EnvironmentSettings; diff --git a/packages/bruno-app/src/components/Modal/StyledWrapper.js b/packages/bruno-app/src/components/Modal/StyledWrapper.js index 98b0f147f..4337b5b80 100644 --- a/packages/bruno-app/src/components/Modal/StyledWrapper.js +++ b/packages/bruno-app/src/components/Modal/StyledWrapper.js @@ -1,11 +1,11 @@ import styled from 'styled-components'; const Wrapper = styled.div` - &.modal--animate-out{ - animation: fade-out 0.5s forwards cubic-bezier(.19,1,.22,1); + &.modal--animate-out { + animation: fade-out 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1); .bruno-modal-card { - animation: fade-and-slide-out-from-top .50s forwards cubic-bezier(.19,1,.22,1); + animation: fade-and-slide-out-from-top 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1); } } @@ -23,8 +23,8 @@ const Wrapper = styled.div` } .bruno-modal-card { - animation-duration: .85s; - animation-delay: .1s; + animation-duration: 0.85s; + animation-delay: 0.1s; background: var(--color-background-top); border-radius: var(--border-radius); position: relative; @@ -33,7 +33,7 @@ const Wrapper = styled.div` box-shadow: var(--box-shadow-base); display: flex; flex-direction: column; - will-change: opacity,transform; + will-change: opacity, transform; flex-grow: 0; margin: 3vh 10vw; margin-top: 50px; @@ -58,7 +58,7 @@ const Wrapper = styled.div` max-width: calc(100% - 30px); } - animation: fade-and-slide-in-from-top .50s forwards cubic-bezier(.19,1,.22,1); + animation: fade-and-slide-in-from-top 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1); } .bruno-modal-header { @@ -102,18 +102,18 @@ const Wrapper = styled.div` will-change: opacity; background: transparent; - &:before{ - content: ""; + &:before { + content: ''; height: 100%; width: 100%; left: 0; - opacity: .4; + opacity: 0.4; top: 0; background: black; position: fixed; } - animation: fade-in .1s forwards cubic-bezier(.19,1,.22,1); + animation: fade-in 0.1s forwards cubic-bezier(0.19, 1, 0.22, 1); } .bruno-modal-footer { diff --git a/packages/bruno-app/src/components/Modal/index.js b/packages/bruno-app/src/components/Modal/index.js index e3a6c57a9..bc7d9079a 100644 --- a/packages/bruno-app/src/components/Modal/index.js +++ b/packages/bruno-app/src/components/Modal/index.js @@ -1,7 +1,7 @@ -import React, {useState, useEffect} from 'react'; +import React, { useState, useEffect } from 'react'; import StyledWrapper from './StyledWrapper'; -const ModalHeader = ({title, handleCancel}) => ( +const ModalHeader = ({ title, handleCancel }) => (
{title ?
{title}
: null} {handleCancel ? ( @@ -12,13 +12,9 @@ const ModalHeader = ({title, handleCancel}) => (
); -const ModalContent = ({children}) => ( -
- {children} -
-); +const ModalContent = ({ children }) =>
{children}
; -const ModalFooter = ({confirmText, cancelText, handleSubmit, handleCancel, confirmDisabled, hideCancel, hideFooter}) => { +const ModalFooter = ({ confirmText, cancelText, handleSubmit, handleCancel, confirmDisabled, hideCancel, hideFooter }) => { confirmText = confirmText || 'Save'; cancelText = cancelText || 'Cancel'; @@ -28,32 +24,21 @@ const ModalFooter = ({confirmText, cancelText, handleSubmit, handleCancel, confi return (
- + -
); -} +}; -const Modal = ({ - size, - title, - confirmText, - cancelText, - handleCancel, - handleConfirm, - children, - confirmDisabled, - hideCancel, - hideFooter -}) => { +const Modal = ({ size, title, confirmText, cancelText, handleCancel, handleConfirm, children, confirmDisabled, hideCancel, hideFooter }) => { const [isClosing, setIsClosing] = useState(false); const escFunction = (event) => { const escKeyCode = 27; @@ -72,7 +57,7 @@ const Modal = ({ return () => { document.removeEventListener('keydown', escFunction, false); - } + }; }, []); let classes = 'bruno-modal'; @@ -84,11 +69,11 @@ const Modal = ({
closeModal()} /> {children} - closeModal()} - handleSubmit={handleConfirm} + handleCancel={() => closeModal()} + handleSubmit={handleConfirm} confirmDisabled={confirmDisabled} hideCancel={hideCancel} hideFooter={hideFooter} diff --git a/packages/bruno-app/src/components/Navbar/StyledWrapper.js b/packages/bruno-app/src/components/Navbar/StyledWrapper.js index 4a4d12302..8336ce672 100644 --- a/packages/bruno-app/src/components/Navbar/StyledWrapper.js +++ b/packages/bruno-app/src/components/Navbar/StyledWrapper.js @@ -14,7 +14,6 @@ const StyledWrapper = styled.div` user-select: none; } } - `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Navbar/index.js b/packages/bruno-app/src/components/Navbar/index.js index d95f4fe42..7f723b5ce 100644 --- a/packages/bruno-app/src/components/Navbar/index.js +++ b/packages/bruno-app/src/components/Navbar/index.js @@ -1,7 +1,7 @@ import React, { useState, forwardRef, useRef } from 'react'; import Dropdown from '../Dropdown'; -import { faCaretDown } from "@fortawesome/free-solid-svg-icons"; -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faCaretDown } from '@fortawesome/free-solid-svg-icons'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { IconBox, IconSearch, IconDots } from '@tabler/icons'; import StyledWrapper from './StyledWrapper'; @@ -9,11 +9,11 @@ const Navbar = () => { const [modalOpen, setModalOpen] = useState(false); const menuDropdownTippyRef = useRef(); - const onMenuDropdownCreate = (ref) => menuDropdownTippyRef.current = ref; + const onMenuDropdownCreate = (ref) => (menuDropdownTippyRef.current = ref); const MenuIcon = forwardRef((props, ref) => { return (
- +
); }); @@ -25,27 +25,36 @@ const Navbar = () => { {/* */}
- } placement='bottom-start'> -
{ - menuDropdownTippyRef.current.hide(); - setModalOpen(true); - }}> + } placement="bottom-start"> +
{ + menuDropdownTippyRef.current.hide(); + setModalOpen(true); + }} + > Create Collection
-
{ - menuDropdownTippyRef.current.hide(); - }}> +
{ + menuDropdownTippyRef.current.hide(); + }} + > Import Collection
-
{ - menuDropdownTippyRef.current.hide(); - }}> +
{ + menuDropdownTippyRef.current.hide(); + }} + > Settings
- ) + ); }; export default Navbar; diff --git a/packages/bruno-app/src/components/Portal/index.js b/packages/bruno-app/src/components/Portal/index.js index 9029fc175..4d34c0a04 100644 --- a/packages/bruno-app/src/components/Portal/index.js +++ b/packages/bruno-app/src/components/Portal/index.js @@ -1,7 +1,7 @@ import { createPortal } from 'react-dom'; function Portal({ children, wrapperId }) { - wrapperId = wrapperId || "bruno-app-body"; + wrapperId = wrapperId || 'bruno-app-body'; return createPortal(children, document.getElementById(wrapperId)); } diff --git a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js index 279e3b9c4..84fc53d91 100644 --- a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js @@ -6,7 +6,8 @@ const Wrapper = styled.div` border-collapse: collapse; font-weight: 600; - thead, td { + thead, + td { border: 1px solid #efefef; } @@ -24,18 +25,18 @@ const Wrapper = styled.div` font-size: 0.8125rem; } - input[type="text"] { + input[type='text'] { width: 100%; border: solid 1px transparent; outline: none !important; - &:focus{ + &:focus { outline: none !important; border: solid 1px transparent; } } - input[type="checkbox"] { + input[type='checkbox'] { cursor: pointer; position: relative; top: 1px; diff --git a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/index.js b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/index.js index 67692e305..1a8a189b9 100644 --- a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/index.js +++ b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/index.js @@ -6,52 +6,58 @@ import { useDispatch } from 'react-redux'; import { addFormUrlEncodedParam, updateFormUrlEncodedParam, deleteFormUrlEncodedParam } from 'providers/ReduxStore/slices/collections'; import StyledWrapper from './StyledWrapper'; -const FormUrlEncodedParams = ({item, collection}) => { +const FormUrlEncodedParams = ({ item, collection }) => { const dispatch = useDispatch(); const params = item.draft ? get(item, 'draft.request.body.formUrlEncoded') : get(item, 'request.body.formUrlEncoded'); const addParam = () => { - dispatch(addFormUrlEncodedParam({ - itemUid: item.uid, - collectionUid: collection.uid, - })); + dispatch( + addFormUrlEncodedParam({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; const handleParamChange = (e, _param, type) => { const param = cloneDeep(_param); - switch(type) { - case 'name' : { + switch (type) { + case 'name': { param.name = e.target.value; break; } - case 'value' : { + case 'value': { param.value = e.target.value; break; } - case 'description' : { + case 'description': { param.description = e.target.value; break; } - case 'enabled' : { + case 'enabled': { param.enabled = e.target.checked; break; } } - dispatch(updateFormUrlEncodedParam({ - param: param, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + updateFormUrlEncodedParam({ + param: param, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + const handleRemoveParams = (param) => { - dispatch(deleteFormUrlEncodedParam({ - paramUid: param.uid, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + deleteFormUrlEncodedParam({ + paramUid: param.uid, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + return ( @@ -64,56 +70,64 @@ const FormUrlEncodedParams = ({item, collection}) => { - {params && params.length ? params.map((param, index) => { - return ( - - - - - - - ); - }) : null} + {params && params.length + ? params.map((param, index) => { + return ( + + + + + + + ); + }) + : null}
- handleParamChange(e, param, 'name')} - /> - - handleParamChange(e, param, 'value')} - /> - - handleParamChange(e, param, 'description')} - /> - -
- handleParamChange(e, param, 'enabled')} - /> - -
-
+ handleParamChange(e, param, 'name')} + /> + + handleParamChange(e, param, 'value')} + /> + + handleParamChange(e, param, 'description')} + /> + +
+ handleParamChange(e, param, 'enabled')} /> + +
+
- + - ) + ); }; -export default FormUrlEncodedParams; \ No newline at end of file +export default FormUrlEncodedParams; diff --git a/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/StyledWrapper.js index 3422c30c5..42a764874 100644 --- a/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/StyledWrapper.js @@ -18,7 +18,11 @@ const StyledWrapper = styled.div` color: rgb(125 125 125); outline: none !important; - &:focus, &:active, &:focus-within, &:focus-visible, &:target { + &:focus, + &:active, + &:focus-within, + &:focus-visible, + &:target { outline: none !important; box-shadow: none !important; } @@ -38,7 +42,11 @@ const StyledWrapper = styled.div` outline: none !important; box-shadow: none !important; - &:focus, &:active, &:focus-within, &:focus-visible, &:target { + &:focus, + &:active, + &:focus-within, + &:focus-visible, + &:target { border: none; outline: none !important; box-shadow: none !important; @@ -49,7 +57,6 @@ const StyledWrapper = styled.div` box-shadow: none !important; } } - `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/index.js b/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/index.js index c4332bb77..089d494b9 100644 --- a/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/index.js +++ b/packages/bruno-app/src/components/RequestPane/GraphQLRequestPane/index.js @@ -4,23 +4,17 @@ import QueryEditor from 'components/RequestPane/QueryEditor'; import RequestHeaders from 'components/RequestPane/RequestHeaders'; import StyledWrapper from './StyledWrapper'; -const GraphQLRequestPane = ({onRunQuery, schema, leftPaneWidth, value, onQueryChange}) => { +const GraphQLRequestPane = ({ onRunQuery, schema, leftPaneWidth, value, onQueryChange }) => { return ( - + Query Headers
- +
@@ -28,7 +22,7 @@ const GraphQLRequestPane = ({onRunQuery, schema, leftPaneWidth, value, onQueryCh - ) + ); }; export default GraphQLRequestPane; diff --git a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/StyledWrapper.js index 70e63168a..4f7edd43a 100644 --- a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/StyledWrapper.js @@ -10,7 +10,11 @@ const StyledWrapper = styled.div` color: var(--color-tab-inactive); cursor: pointer; - &:focus, &:active, &:focus-within, &:focus-visible, &:target { + &:focus, + &:active, + &:focus-within, + &:focus-visible, + &:target { outline: none !important; box-shadow: none !important; } @@ -23,4 +27,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js index 51dd0d510..ec66a44e0 100644 --- a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js +++ b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js @@ -9,73 +9,75 @@ import RequestBody from 'components/RequestPane/RequestBody'; import RequestBodyMode from 'components/RequestPane/RequestBody/RequestBodyMode'; import StyledWrapper from './StyledWrapper'; -const HttpRequestPane = ({item, collection, leftPaneWidth}) => { +const HttpRequestPane = ({ item, collection, leftPaneWidth }) => { const dispatch = useDispatch(); const tabs = useSelector((state) => state.tabs.tabs); const activeTabUid = useSelector((state) => state.tabs.activeTabUid); const selectTab = (tab) => { - dispatch(updateRequestPaneTab({ - uid: item.uid, - requestPaneTab: tab - })) + dispatch( + updateRequestPaneTab({ + uid: item.uid, + requestPaneTab: tab + }) + ); }; const getTabPanel = (tab) => { - switch(tab) { + switch (tab) { case 'params': { - return ; + return ; } case 'body': { - return ; + return ; } case 'headers': { - return ; + return ; } default: { return
404 | Not found
; } } - } + }; - if(!activeTabUid) { - return ( -
Something went wrong
- ); + if (!activeTabUid) { + return
Something went wrong
; } const focusedTab = find(tabs, (t) => t.uid === activeTabUid); - if(!focusedTab || !focusedTab.uid || !focusedTab.requestPaneTab) { - return ( -
An error occured!
- ); + if (!focusedTab || !focusedTab.uid || !focusedTab.requestPaneTab) { + return
An error occured!
; } const getTabClassname = (tabName) => { return classnames(`tab select-none ${tabName}`, { - 'active': tabName === focusedTab.requestPaneTab + active: tabName === focusedTab.requestPaneTab }); }; return (
-
selectTab('params')}>Params
-
selectTab('body')}>Body
-
selectTab('headers')}>Headers
+
selectTab('params')}> + Params +
+
selectTab('body')}> + Body +
+
selectTab('headers')}> + Headers +
{/* Moved to post mvp */} {/*
selectTab('auth')}>Auth
*/} {focusedTab.requestPaneTab === 'body' ? (
- +
- ) : null } + ) : null}
-
- {getTabPanel(focusedTab.requestPaneTab)} -
+
{getTabPanel(focusedTab.requestPaneTab)}
 - ) + ); }; export default HttpRequestPane; diff --git a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js index 279e3b9c4..84fc53d91 100644 --- a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js @@ -6,7 +6,8 @@ const Wrapper = styled.div` border-collapse: collapse; font-weight: 600; - thead, td { + thead, + td { border: 1px solid #efefef; } @@ -24,18 +25,18 @@ const Wrapper = styled.div` font-size: 0.8125rem; } - input[type="text"] { + input[type='text'] { width: 100%; border: solid 1px transparent; outline: none !important; - &:focus{ + &:focus { outline: none !important; border: solid 1px transparent; } } - input[type="checkbox"] { + input[type='checkbox'] { cursor: pointer; position: relative; top: 1px; diff --git a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js index 0207ae06d..40a50b070 100644 --- a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js +++ b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js @@ -6,52 +6,58 @@ import { useDispatch } from 'react-redux'; import { addMultipartFormParam, updateMultipartFormParam, deleteMultipartFormParam } from 'providers/ReduxStore/slices/collections'; import StyledWrapper from './StyledWrapper'; -const MultipartFormParams = ({item, collection}) => { +const MultipartFormParams = ({ item, collection }) => { const dispatch = useDispatch(); const params = item.draft ? get(item, 'draft.request.body.multipartForm') : get(item, 'request.body.multipartForm'); const addParam = () => { - dispatch(addMultipartFormParam({ - itemUid: item.uid, - collectionUid: collection.uid, - })); + dispatch( + addMultipartFormParam({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; const handleParamChange = (e, _param, type) => { const param = cloneDeep(_param); - switch(type) { - case 'name' : { + switch (type) { + case 'name': { param.name = e.target.value; break; } - case 'value' : { + case 'value': { param.value = e.target.value; break; } - case 'description' : { + case 'description': { param.description = e.target.value; break; } - case 'enabled' : { + case 'enabled': { param.enabled = e.target.checked; break; } } - dispatch(updateMultipartFormParam({ - param: param, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + updateMultipartFormParam({ + param: param, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + const handleRemoveParams = (param) => { - dispatch(deleteMultipartFormParam({ - paramUid: param.uid, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + deleteMultipartFormParam({ + paramUid: param.uid, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + return ( @@ -64,56 +70,64 @@ const MultipartFormParams = ({item, collection}) => { - {params && params.length ? params.map((param, index) => { - return ( - - - - - - - ); - }) : null} + {params && params.length + ? params.map((param, index) => { + return ( + + + + + + + ); + }) + : null}
- handleParamChange(e, param, 'name')} - /> - - handleParamChange(e, param, 'value')} - /> - - handleParamChange(e, param, 'description')} - /> - -
- handleParamChange(e, param, 'enabled')} - /> - -
-
+ handleParamChange(e, param, 'name')} + /> + + handleParamChange(e, param, 'value')} + /> + + handleParamChange(e, param, 'description')} + /> + +
+ handleParamChange(e, param, 'enabled')} /> + +
+
- + - ) + ); }; -export default MultipartFormParams; \ No newline at end of file +export default MultipartFormParams; diff --git a/packages/bruno-app/src/components/RequestPane/QueryEditor/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/QueryEditor/StyledWrapper.js index 835e11ab4..0b7d9803d 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryEditor/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/QueryEditor/StyledWrapper.js @@ -13,4 +13,3 @@ const StyledWrapper = styled.div` `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/RequestPane/QueryEditor/index.js b/packages/bruno-app/src/components/RequestPane/QueryEditor/index.js index afa601715..7a872983e 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryEditor/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryEditor/index.js @@ -44,44 +44,37 @@ export default class QueryEditor extends React.Component { showCursorWhenSelecting: true, readOnly: this.props.readOnly ? 'nocursor' : false, foldGutter: { - minFoldSize: 4, + minFoldSize: 4 }, lint: { schema: this.props.schema, validationRules: this.props.validationRules ?? null, // linting accepts string or FragmentDefinitionNode[] - externalFragments: this.props?.externalFragments, + externalFragments: this.props?.externalFragments }, hintOptions: { schema: this.props.schema, closeOnUnfocus: false, completeSingle: false, container: this._node, - externalFragments: this.props?.externalFragments, + externalFragments: this.props?.externalFragments }, info: { schema: this.props.schema, renderDescription: (text) => md.render(text), - onClick: (reference) => - this.props.onClickReference && this.props.onClickReference(reference), + onClick: (reference) => this.props.onClickReference && this.props.onClickReference(reference) }, jump: { schema: this.props.schema, - onClick: (reference) => - this.props.onClickReference && this.props.onClickReference(reference) + onClick: (reference) => this.props.onClickReference && this.props.onClickReference(reference) }, gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'], extraKeys: { - 'Cmd-Space': () => - editor.showHint({ completeSingle: true, container: this._node }), - 'Ctrl-Space': () => - editor.showHint({ completeSingle: true, container: this._node }), - 'Alt-Space': () => - editor.showHint({ completeSingle: true, container: this._node }), - 'Shift-Space': () => - editor.showHint({ completeSingle: true, container: this._node }), - 'Shift-Alt-Space': () => - editor.showHint({ completeSingle: true, container: this._node }), + 'Cmd-Space': () => editor.showHint({ completeSingle: true, container: this._node }), + 'Ctrl-Space': () => editor.showHint({ completeSingle: true, container: this._node }), + 'Alt-Space': () => editor.showHint({ completeSingle: true, container: this._node }), + 'Shift-Space': () => editor.showHint({ completeSingle: true, container: this._node }), + 'Shift-Alt-Space': () => editor.showHint({ completeSingle: true, container: this._node }), 'Cmd-Enter': () => { if (this.props.onRunQuery) { @@ -129,8 +122,8 @@ export default class QueryEditor extends React.Component { if (this.props.onRunQuery) { // empty } - }, - }, + } + } })); if (editor) { editor.on('change', this._onEdit); @@ -152,11 +145,7 @@ export default class QueryEditor extends React.Component { this.editor.options.jump.schema = this.props.schema; CodeMirror.signal(this.editor, 'change', this.editor); } - if ( - this.props.value !== prevProps.value && - this.props.value !== this.cachedValue && - this.editor - ) { + if (this.props.value !== prevProps.value && this.props.value !== this.cachedValue && this.editor) { this.cachedValue = this.props.value; this.editor.setValue(this.props.value); } @@ -177,7 +166,7 @@ export default class QueryEditor extends React.Component { { + ref={(node) => { this._node = node; }} /> diff --git a/packages/bruno-app/src/components/RequestPane/QueryEditor/onHasCompletion.js b/packages/bruno-app/src/components/RequestPane/QueryEditor/onHasCompletion.js index 107f91ed8..15bb2c867 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryEditor/onHasCompletion.js +++ b/packages/bruno-app/src/components/RequestPane/QueryEditor/onHasCompletion.js @@ -7,10 +7,7 @@ import escapeHTML from 'escape-html'; import MD from 'markdown-it'; -import { - GraphQLNonNull, - GraphQLList -} from 'graphql'; +import { GraphQLNonNull, GraphQLList } from 'graphql'; const md = new MD(); @@ -18,85 +15,65 @@ const md = new MD(); * Render a custom UI for CodeMirror's hint which includes additional info * about the type and description for the selected context. */ -export default function onHasCompletion( - _cm, - data, - onHintInformationRender, -) { +export default function onHasCompletion(_cm, data, onHintInformationRender) { const CodeMirror = require('codemirror'); let information; let deprecation; // When a hint result is selected, we augment the UI with information. - CodeMirror.on( - data, - 'select', - (ctx, el) => { - // Only the first time (usually when the hint UI is first displayed) - // do we create the information nodes. - if (!information) { - const hintsUl = el.parentNode; + CodeMirror.on(data, 'select', (ctx, el) => { + // Only the first time (usually when the hint UI is first displayed) + // do we create the information nodes. + if (!information) { + const hintsUl = el.parentNode; - // This "information" node will contain the additional info about the - // highlighted typeahead option. - information = document.createElement('div'); - information.className = 'CodeMirror-hint-information'; - hintsUl.appendChild(information); + // This "information" node will contain the additional info about the + // highlighted typeahead option. + information = document.createElement('div'); + information.className = 'CodeMirror-hint-information'; + hintsUl.appendChild(information); - // This "deprecation" node will contain info about deprecated usage. - deprecation = document.createElement('div'); - deprecation.className = 'CodeMirror-hint-deprecation'; - hintsUl.appendChild(deprecation); + // This "deprecation" node will contain info about deprecated usage. + deprecation = document.createElement('div'); + deprecation.className = 'CodeMirror-hint-deprecation'; + hintsUl.appendChild(deprecation); - // When CodeMirror attempts to remove the hint UI, we detect that it was - // removed and in turn remove the information nodes. - let onRemoveFn; - hintsUl.addEventListener( - 'DOMNodeRemoved', - (onRemoveFn = (event) => { - if (event.target === hintsUl) { - hintsUl.removeEventListener('DOMNodeRemoved', onRemoveFn); - information = null; - deprecation = null; - onRemoveFn = null; - } - }), - ); - } + // When CodeMirror attempts to remove the hint UI, we detect that it was + // removed and in turn remove the information nodes. + let onRemoveFn; + hintsUl.addEventListener( + 'DOMNodeRemoved', + (onRemoveFn = (event) => { + if (event.target === hintsUl) { + hintsUl.removeEventListener('DOMNodeRemoved', onRemoveFn); + information = null; + deprecation = null; + onRemoveFn = null; + } + }) + ); + } - // Now that the UI has been set up, add info to information. - const description = ctx.description - ? md.render(ctx.description) - : 'Self descriptive.'; - const type = ctx.type - ? '' + renderType(ctx.type) + '' - : ''; + // Now that the UI has been set up, add info to information. + const description = ctx.description ? md.render(ctx.description) : 'Self descriptive.'; + const type = ctx.type ? '' + renderType(ctx.type) + '' : ''; - information.innerHTML = - '
' + - (description.slice(0, 3) === '

' - ? '

' + type + description.slice(3) - : type + description) + - '

'; + information.innerHTML = '
' + (description.slice(0, 3) === '

' ? '

' + type + description.slice(3) : type + description) + '

'; - if (ctx && deprecation && ctx.deprecationReason) { - const reason = ctx.deprecationReason - ? md.render(ctx.deprecationReason) - : ''; - deprecation.innerHTML = - 'Deprecated' + reason; - deprecation.style.display = 'block'; - } else if (deprecation) { - deprecation.style.display = 'none'; - } + if (ctx && deprecation && ctx.deprecationReason) { + const reason = ctx.deprecationReason ? md.render(ctx.deprecationReason) : ''; + deprecation.innerHTML = 'Deprecated' + reason; + deprecation.style.display = 'block'; + } else if (deprecation) { + deprecation.style.display = 'none'; + } - // Additional rendering? - if (onHintInformationRender) { - onHintInformationRender(information); - } - }, - ); + // Additional rendering? + if (onHintInformationRender) { + onHintInformationRender(information); + } + }); } function renderType(type) { diff --git a/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js index 50a6e7890..b0f26f0b3 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js @@ -6,7 +6,8 @@ const Wrapper = styled.div` border-collapse: collapse; font-weight: 600; - thead, td { + thead, + td { border: 1px solid #efefef; } @@ -27,18 +28,18 @@ const Wrapper = styled.div` } } - input[type="text"] { + input[type='text'] { width: 100%; border: solid 1px transparent; outline: none !important; - &:focus{ + &:focus { outline: none !important; border: solid 1px transparent; } } - input[type="checkbox"] { + input[type='checkbox'] { cursor: pointer; position: relative; top: 1px; diff --git a/packages/bruno-app/src/components/RequestPane/QueryParams/index.js b/packages/bruno-app/src/components/RequestPane/QueryParams/index.js index 6121efcb0..defff15c9 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryParams/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryParams/index.js @@ -7,52 +7,58 @@ import { addQueryParam, updateQueryParam, deleteQueryParam } from 'providers/Red import StyledWrapper from './StyledWrapper'; -const QueryParams = ({item, collection}) => { +const QueryParams = ({ item, collection }) => { const dispatch = useDispatch(); const params = item.draft ? get(item, 'draft.request.params') : get(item, 'request.params'); const handleAddParam = () => { - dispatch(addQueryParam({ - itemUid: item.uid, - collectionUid: collection.uid, - })); + dispatch( + addQueryParam({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; const handleParamChange = (e, _param, type) => { const param = cloneDeep(_param); - switch(type) { - case 'name' : { + switch (type) { + case 'name': { param.name = e.target.value; break; } - case 'value' : { + case 'value': { param.value = e.target.value; break; } - case 'description' : { + case 'description': { param.description = e.target.value; break; } - case 'enabled' : { + case 'enabled': { param.enabled = e.target.checked; break; } } - dispatch(updateQueryParam({ - param, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + updateQueryParam({ + param, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + const handleRemoveParam = (param) => { - dispatch(deleteQueryParam({ - paramUid: param.uid, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + deleteQueryParam({ + paramUid: param.uid, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; return ( @@ -67,58 +73,64 @@ const QueryParams = ({item, collection}) => { - {params && params.length ? params.map((param, index) => { - return ( - - - handleParamChange(e, param, 'name')} - /> - - - handleParamChange(e, param, 'value')} - /> - - - handleParamChange(e, param, 'description')} - /> - - -
- handleParamChange(e, param, 'enabled')} - /> - -
- - - ); - }) : null} + {params && params.length + ? params.map((param, index) => { + return ( + + + handleParamChange(e, param, 'name')} + /> + + + handleParamChange(e, param, 'value')} + /> + + + handleParamChange(e, param, 'description')} + /> + + +
+ handleParamChange(e, param, 'enabled')} /> + +
+ + + ); + }) + : null} - ) + ); }; -export default QueryParams; \ No newline at end of file +export default QueryParams; diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/StyledWrapper.js index c642e6f1b..10177c0f8 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/StyledWrapper.js @@ -17,7 +17,7 @@ const Wrapper = styled.div` } .dropdown-item { - padding: .25rem .6rem !important; + padding: 0.25rem 0.6rem !important; } } diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/index.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/index.js index c73617681..0a7d32048 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/HttpMethodSelector/index.js @@ -3,43 +3,48 @@ import { IconCaretDown } from '@tabler/icons'; import Dropdown from 'components/Dropdown'; import StyledWrapper from './StyledWrapper'; -const HttpMethodSelector = ({method, onMethodSelect}) => { +const HttpMethodSelector = ({ method, onMethodSelect }) => { const dropdownTippyRef = useRef(); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const Icon = forwardRef((props, ref) => { return (
{method}
-
+
+ +
); }); const handleMethodSelect = (verb) => onMethodSelect(verb); - const Verb = ({verb}) => { + const Verb = ({ verb }) => { return ( -
{ - dropdownTippyRef.current.hide(); - handleMethodSelect(verb); - }}> +
{ + dropdownTippyRef.current.hide(); + handleMethodSelect(verb); + }} + > {verb}
); }; - return( + return (
- } placement='bottom-start'> - - - - - - - + } placement="bottom-start"> + + + + + + +
diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js index e47b8387b..8487417ad 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js @@ -6,45 +6,53 @@ import HttpMethodSelector from './HttpMethodSelector'; import StyledWrapper from './StyledWrapper'; import SendSvg from 'assets/send.svg'; -const QueryUrl = ({item, collection, handleRun}) => { +const QueryUrl = ({ item, collection, handleRun }) => { const dispatch = useDispatch(); const method = item.draft ? get(item, 'draft.request.method') : get(item, 'request.method'); let url = item.draft ? get(item, 'draft.request.url') : get(item, 'request.url'); const onUrlChange = (value) => { - dispatch(requestUrlChanged({ - itemUid: item.uid, - collectionUid: collection.uid, - url: value - })); + dispatch( + requestUrlChanged({ + itemUid: item.uid, + collectionUid: collection.uid, + url: value + }) + ); }; const onMethodSelect = (verb) => { - dispatch(updateRequestMethod({ - method: verb, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + updateRequestMethod({ + method: verb, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; return (
- +
onUrlChange(event.target.value)} />
- +
- ) + ); }; export default QueryUrl; diff --git a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/StyledWrapper.js index 74fd04682..6239f07fe 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/StyledWrapper.js @@ -8,12 +8,12 @@ const Wrapper = styled.div` border-radius: 3px; .dropdown-item { - padding: .2rem .6rem !important; + padding: 0.2rem 0.6rem !important; padding-left: 1.5rem !important; } - .label-item { - padding: .2rem .6rem !important; + .label-item { + padding: 0.2rem 0.6rem !important; } } diff --git a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js index 663fbd99e..1614e28f2 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js +++ b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js @@ -7,76 +7,89 @@ import { updateRequestBodyMode } from 'providers/ReduxStore/slices/collections'; import { humanizeRequestBodyMode } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; -const RequestBodyMode = ({item, collection}) => { +const RequestBodyMode = ({ item, collection }) => { const dispatch = useDispatch(); const dropdownTippyRef = useRef(); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const bodyMode = item.draft ? get(item, 'draft.request.body.mode') : get(item, 'request.body.mode'); - const Icon = forwardRef((props, ref) => { return (
- {humanizeRequestBodyMode(bodyMode)} + {humanizeRequestBodyMode(bodyMode)}
); }); const onModeChange = (value) => { - dispatch(updateRequestBodyMode({ - itemUid: item.uid, - collectionUid: collection.uid, - mode: value - })); + dispatch( + updateRequestBodyMode({ + itemUid: item.uid, + collectionUid: collection.uid, + mode: value + }) + ); }; - return( + return (
- } placement='bottom-end'> -
- Form -
-
{ - dropdownTippyRef.current.hide(); - onModeChange('multipartForm'); - }}> + } placement="bottom-end"> +
Form
+
{ + dropdownTippyRef.current.hide(); + onModeChange('multipartForm'); + }} + > Multipart Form
-
{ - dropdownTippyRef.current.hide(); - onModeChange('formUrlEncoded'); - }}> +
{ + dropdownTippyRef.current.hide(); + onModeChange('formUrlEncoded'); + }} + > Form Url Encoded
-
- Raw -
-
{ - dropdownTippyRef.current.hide(); - onModeChange('json'); - }}> +
Raw
+
{ + dropdownTippyRef.current.hide(); + onModeChange('json'); + }} + > JSON
-
{ - dropdownTippyRef.current.hide(); - onModeChange('xml'); - }}> +
{ + dropdownTippyRef.current.hide(); + onModeChange('xml'); + }} + > XML
-
{ - dropdownTippyRef.current.hide(); - onModeChange('text'); - }}> +
{ + dropdownTippyRef.current.hide(); + onModeChange('text'); + }} + > TEXT
-
- Other -
-
{ - dropdownTippyRef.current.hide(); - onModeChange('none'); - }}> +
Other
+
{ + dropdownTippyRef.current.hide(); + onModeChange('none'); + }} + > No Body
diff --git a/packages/bruno-app/src/components/RequestPane/RequestBody/index.js b/packages/bruno-app/src/components/RequestPane/RequestBody/index.js index bb3033369..0d8c88311 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestBody/index.js +++ b/packages/bruno-app/src/components/RequestPane/RequestBody/index.js @@ -8,23 +8,25 @@ import { updateRequestBody } from 'providers/ReduxStore/slices/collections'; import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions'; import StyledWrapper from './StyledWrapper'; -const RequestBody = ({item, collection}) => { +const RequestBody = ({ item, collection }) => { const dispatch = useDispatch(); const body = item.draft ? get(item, 'draft.request.body') : get(item, 'request.body'); const bodyMode = item.draft ? get(item, 'draft.request.body.mode') : get(item, 'request.body.mode'); const onEdit = (value) => { - dispatch(updateRequestBody({ - content: value, - itemUid: item.uid, - collectionUid: collection.uid, - })); + dispatch( + updateRequestBody({ + content: value, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - const onRun = () => dispatch(sendRequest(item, collection.uid));; + const onRun = () => dispatch(sendRequest(item, collection.uid)); const onSave = () => dispatch(saveRequest(item.uid, collection.uid)); - if(['json', 'xml', 'text'].includes(bodyMode)) { + if (['json', 'xml', 'text'].includes(bodyMode)) { let codeMirrorMode = { json: 'application/ld+json', text: 'application/text', @@ -37,31 +39,21 @@ const RequestBody = ({item, collection}) => { xml: body.xml }; - return( + return ( - + ); } - if(bodyMode === 'formUrlEncoded') { - return ; + if (bodyMode === 'formUrlEncoded') { + return ; } - if(bodyMode === 'multipartForm') { - return ; + if (bodyMode === 'multipartForm') { + return ; } - return( - - No Body - - ); + return No Body; }; export default RequestBody; diff --git a/packages/bruno-app/src/components/RequestPane/RequestHeaders/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/RequestHeaders/StyledWrapper.js index 122dd0907..3f36e4843 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestHeaders/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/RequestHeaders/StyledWrapper.js @@ -6,7 +6,8 @@ const Wrapper = styled.div` border-collapse: collapse; font-weight: 600; - thead, td { + thead, + td { border: 1px solid #efefef; } @@ -26,18 +27,18 @@ const Wrapper = styled.div` padding: 5px; } - input[type="text"] { + input[type='text'] { width: 100%; border: solid 1px transparent; outline: none !important; - &:focus{ + &:focus { outline: none !important; border: solid 1px transparent; } } - input[type="checkbox"] { + input[type='checkbox'] { cursor: pointer; position: relative; top: 1px; diff --git a/packages/bruno-app/src/components/RequestPane/RequestHeaders/index.js b/packages/bruno-app/src/components/RequestPane/RequestHeaders/index.js index bb2497f91..8e39dec55 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestHeaders/index.js +++ b/packages/bruno-app/src/components/RequestPane/RequestHeaders/index.js @@ -6,52 +6,58 @@ import { useDispatch } from 'react-redux'; import { addRequestHeader, updateRequestHeader, deleteRequestHeader } from 'providers/ReduxStore/slices/collections'; import StyledWrapper from './StyledWrapper'; -const RequestHeaders = ({item, collection}) => { +const RequestHeaders = ({ item, collection }) => { const dispatch = useDispatch(); const headers = item.draft ? get(item, 'draft.request.headers') : get(item, 'request.headers'); const addHeader = () => { - dispatch(addRequestHeader({ - itemUid: item.uid, - collectionUid: collection.uid, - })); + dispatch( + addRequestHeader({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; const handleHeaderValueChange = (e, _header, type) => { const header = cloneDeep(_header); - switch(type) { - case 'name' : { + switch (type) { + case 'name': { header.name = e.target.value; break; } - case 'value' : { + case 'value': { header.value = e.target.value; break; } - case 'description' : { + case 'description': { header.description = e.target.value; break; } - case 'enabled' : { + case 'enabled': { header.enabled = e.target.checked; break; } } - dispatch(updateRequestHeader({ - header: header, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + updateRequestHeader({ + header: header, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + const handleRemoveHeader = (header) => { - dispatch(deleteRequestHeader({ - headerUid: header.uid, - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + deleteRequestHeader({ + headerUid: header.uid, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }; - + return ( @@ -64,56 +70,64 @@ const RequestHeaders = ({item, collection}) => { - {headers && headers.length ? headers.map((header, index) => { - return ( - - - - - - - ); - }) : null} + {headers && headers.length + ? headers.map((header, index) => { + return ( + + + + + + + ); + }) + : null}
- handleHeaderValueChange(e, header, 'name')} - /> - - handleHeaderValueChange(e, header, 'value')} - /> - - handleHeaderValueChange(e, header, 'description')} - /> - -
- handleHeaderValueChange(e, header, 'enabled')} - /> - -
-
+ handleHeaderValueChange(e, header, 'name')} + /> + + handleHeaderValueChange(e, header, 'value')} + /> + + handleHeaderValueChange(e, header, 'description')} + /> + +
+ handleHeaderValueChange(e, header, 'enabled')} /> + +
+
- + - ) + ); }; -export default RequestHeaders; \ No newline at end of file +export default RequestHeaders; diff --git a/packages/bruno-app/src/components/RequestPane/SaveRequest/index.js b/packages/bruno-app/src/components/RequestPane/SaveRequest/index.js index e9c9a17da..a0ddaca90 100644 --- a/packages/bruno-app/src/components/RequestPane/SaveRequest/index.js +++ b/packages/bruno-app/src/components/RequestPane/SaveRequest/index.js @@ -1,53 +1,44 @@ import React, { useState, useEffect } from 'react'; -import { faFolder } from "@fortawesome/free-solid-svg-icons"; -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faFolder } from '@fortawesome/free-solid-svg-icons'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import StyledWrapper from './StyledWrapper'; import Modal from 'components//Modal'; -const SaveRequest = ({items, onClose}) => { +const SaveRequest = ({ items, onClose }) => { const [showFolders, setShowFolders] = useState([]); useEffect(() => { setShowFolders(items || []); - }, [items]) + }, [items]); const handleFolderClick = (folder) => { let subFolders = []; - if(folder.items && folder.items.length) { + if (folder.items && folder.items.length) { for (let item of folder.items) { if (item.items) { - subFolders.push(item) + subFolders.push(item); } } - - if(subFolders.length) { + + if (subFolders.length) { setShowFolders(subFolders); } } - } + }; return ( - +

Select a folder to save request:

- {showFolders && showFolders.length ? showFolders.map((folder) => ( -
handleFolderClick(folder)} - > - - {folder.name} -
- )): null} + {showFolders && showFolders.length + ? showFolders.map((folder) => ( +
handleFolderClick(folder)}> + + {folder.name} +
+ )) + : null}
diff --git a/packages/bruno-app/src/components/RequestTabPanel/RequestNotFound/index.js b/packages/bruno-app/src/components/RequestTabPanel/RequestNotFound/index.js index 51ca8a9f6..26c436f63 100644 --- a/packages/bruno-app/src/components/RequestTabPanel/RequestNotFound/index.js +++ b/packages/bruno-app/src/components/RequestTabPanel/RequestNotFound/index.js @@ -2,22 +2,22 @@ import React from 'react'; import { closeTabs } from 'providers/ReduxStore/slices/tabs'; import { useDispatch } from 'react-redux'; -const RequestNotFound = ({itemUid}) => { +const RequestNotFound = ({ itemUid }) => { const dispatch = useDispatch(); const closeTab = () => { - dispatch(closeTabs({ - tabUids: [itemUid] - })); + dispatch( + closeTabs({ + tabUids: [itemUid] + }) + ); }; return (
Request no longer exists.
-
- This can happen when the yml file associated with this request was deleted on your filesystem. -
+
This can happen when the yml file associated with this request was deleted on your filesystem.
- +
- ) + ); }; export default RequestTabPanel; diff --git a/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/StyledWrapper.js b/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/StyledWrapper.js index 195b0632f..ec278887d 100644 --- a/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/StyledWrapper.js @@ -1,6 +1,5 @@ import styled from 'styled-components'; -const StyledWrapper = styled.div` -`; +const StyledWrapper = styled.div``; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/index.js b/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/index.js index fd728e2ec..98a399e79 100644 --- a/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/index.js +++ b/packages/bruno-app/src/components/RequestTabs/CollectionToolBar/index.js @@ -3,20 +3,20 @@ import { IconFiles } from '@tabler/icons'; import EnvironmentSelector from 'components/Environments/EnvironmentSelector'; import StyledWrapper from './StyledWrapper'; -const CollectionToolBar = ({collection}) => { +const CollectionToolBar = ({ collection }) => { return (
- + {collection.name}
- +
- ) + ); }; export default CollectionToolBar; diff --git a/packages/bruno-app/src/components/RequestTabs/RequestTab/StyledWrapper.js b/packages/bruno-app/src/components/RequestTabs/RequestTab/StyledWrapper.js index 7a9969bdd..71f04f6bc 100644 --- a/packages/bruno-app/src/components/RequestTabs/RequestTab/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestTabs/RequestTab/StyledWrapper.js @@ -8,7 +8,7 @@ const StyledWrapper = styled.div` .tab-name { overflow: hidden; text-overflow: ellipsis; - white-space: nowrap; + white-space: nowrap; } .close-icon-container { @@ -25,16 +25,16 @@ const StyledWrapper = styled.div` padding-top: 6px; } - &:hover, &:hover .close-icon { + &:hover, + &:hover .close-icon { background-color: #eaeaea; color: rgb(76 76 76); } - .has-changes-icon { + .has-changes-icon { height: 24px; } } `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/RequestTabs/RequestTab/index.js b/packages/bruno-app/src/components/RequestTabs/RequestTab/index.js index 3b4c54b2d..06007075c 100644 --- a/packages/bruno-app/src/components/RequestTabs/RequestTab/index.js +++ b/packages/bruno-app/src/components/RequestTabs/RequestTab/index.js @@ -6,21 +6,23 @@ import { findItemInCollection } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; import { IconAlertTriangle } from '@tabler/icons'; -const RequestTab = ({tab, collection}) => { +const RequestTab = ({ tab, collection }) => { const dispatch = useDispatch(); const handleCloseClick = (event) => { event.stopPropagation(); event.preventDefault(); - dispatch(closeTabs({ - tabUids: [tab.uid] - })) + dispatch( + closeTabs({ + tabUids: [tab.uid] + }) + ); }; const getMethodColor = (method = '') => { let color = ''; method = method.toLocaleLowerCase(); - switch(method) { + switch (method) { case 'get': { color = 'var(--color-method-get)'; break; @@ -56,16 +58,19 @@ const RequestTab = ({tab, collection}) => { const item = findItemInCollection(collection, tab.uid); - if(!item) { + if (!item) { return (
- + Not Found
handleCloseClick(e)}> - - + +
@@ -77,19 +82,26 @@ const RequestTab = ({tab, collection}) => { return (
- {method} - {item.name} + + {method} + + + {item.name} +
handleCloseClick(e)}> {!item.draft ? ( - - + + ) : ( - + - ) } + )}
); diff --git a/packages/bruno-app/src/components/RequestTabs/StyledWrapper.js b/packages/bruno-app/src/components/RequestTabs/StyledWrapper.js index ea8951afe..047dd76f2 100644 --- a/packages/bruno-app/src/components/RequestTabs/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestTabs/StyledWrapper.js @@ -46,7 +46,7 @@ const Wrapper = styled.div` } } - &:hover{ + &:hover { .close-icon-container .close-icon { display: block; } diff --git a/packages/bruno-app/src/components/RequestTabs/index.js b/packages/bruno-app/src/components/RequestTabs/index.js index d6484501d..df30f51fd 100644 --- a/packages/bruno-app/src/components/RequestTabs/index.js +++ b/packages/bruno-app/src/components/RequestTabs/index.js @@ -21,38 +21,36 @@ const RequestTabs = () => { const screenWidth = useSelector((state) => state.app.screenWidth); const getTabClassname = (tab, index) => { - return classnames("request-tab select-none", { - 'active': tab.uid === activeTabUid, - 'last-tab': tabs && tabs.length && (index === tabs.length - 1) + return classnames('request-tab select-none', { + active: tab.uid === activeTabUid, + 'last-tab': tabs && tabs.length && index === tabs.length - 1 }); }; const handleClick = (tab) => { - dispatch(focusTab({ - uid: tab.uid - })); + dispatch( + focusTab({ + uid: tab.uid + }) + ); }; const createNewTab = () => setNewRequestModalOpen(true); - if(!activeTabUid) { + if (!activeTabUid) { return null; } const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(!activeTab) { - return ( - - Something went wrong! - - ); + if (!activeTab) { + return Something went wrong!; } const activeCollection = find(collections, (c) => c.uid === activeTab.collectionUid); const collectionRequestTabs = filter(tabs, (t) => t.collectionUid === activeTab.collectionUid); const maxTablistWidth = screenWidth - leftSidebarWidth - 150; - const tabsWidth = (collectionRequestTabs.length * 150) + 34; // 34: (+)icon + const tabsWidth = collectionRequestTabs.length * 150 + 34; // 34: (+)icon const showChevrons = maxTablistWidth < tabsWidth; const leftSlide = () => { @@ -81,16 +79,16 @@ const RequestTabs = () => { // Todo: Must support ephermal requests return ( - {newRequestModalOpen && setNewRequestModalOpen(false)}/>} + {newRequestModalOpen && setNewRequestModalOpen(false)} />} {collectionRequestTabs && collectionRequestTabs.length ? ( <> - +
    {showChevrons ? (
  • - +
    • ) : null} @@ -101,28 +99,30 @@ const RequestTabs = () => {
*/} -
    - {collectionRequestTabs && collectionRequestTabs.length ? collectionRequestTabs.map((tab, index) => { - return ( -
  • handleClick(tab)}> - -
    • - ) - }) : null} +
      + {collectionRequestTabs && collectionRequestTabs.length + ? collectionRequestTabs.map((tab, index) => { + return ( +
    • handleClick(tab)}> + +
      • + ); + }) + : null}
    - +
      {showChevrons ? (
    • - +
      • ) : null}
    • - - + +
      • diff --git a/packages/bruno-app/src/components/ResponsePane/NetworkError/index.js b/packages/bruno-app/src/components/ResponsePane/NetworkError/index.js index 2c7c55781..906d06677 100644 --- a/packages/bruno-app/src/components/ResponsePane/NetworkError/index.js +++ b/packages/bruno-app/src/components/ResponsePane/NetworkError/index.js @@ -1,30 +1,27 @@ import React from 'react'; -const NetworkError = ({onClose}) => { +const NetworkError = ({ onClose }) => { return ( -
      -
      -
      -
      -

      - Network Error -

      -

      - Please note that if you are using Bruno on the web, then the api you are connecting to must allow CORS. - If not, please use the chrome extension or the desktop app -

      -
      +
      +
      +
      +
      +

      Network Error

      +

      + Please note that if you are using Bruno on the web, then the api you are connecting to must allow CORS. If not, please use the chrome extension or the desktop app +

      -
      - -
      +
      + +
      +
      ); }; diff --git a/packages/bruno-app/src/components/ResponsePane/Overlay/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/Overlay/StyledWrapper.js index 11e0aeb05..f5440aaaf 100644 --- a/packages/bruno-app/src/components/ResponsePane/Overlay/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/Overlay/StyledWrapper.js @@ -1,7 +1,7 @@ import styled from 'styled-components'; const StyledWrapper = styled.div` - div.overlay{ + div.overlay { position: absolute; top: 0; right: 0; @@ -18,4 +18,3 @@ const StyledWrapper = styled.div` `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/ResponsePane/Overlay/index.js b/packages/bruno-app/src/components/ResponsePane/Overlay/index.js index e50032500..21e2d31ac 100644 --- a/packages/bruno-app/src/components/ResponsePane/Overlay/index.js +++ b/packages/bruno-app/src/components/ResponsePane/Overlay/index.js @@ -5,7 +5,7 @@ import { cancelRequest } from 'providers/ReduxStore/slices/collections/actions'; import StopWatch from '../../StopWatch'; import StyledWrapper from './StyledWrapper'; -const ResponseLoadingOverlay = ({item, collection}) => { +const ResponseLoadingOverlay = ({ item, collection }) => { const dispatch = useDispatch(); const handleCancelRequest = () => { @@ -15,15 +15,16 @@ const ResponseLoadingOverlay = ({item, collection}) => { return (
      -
      -
      - +
      +
      +
      - + diff --git a/packages/bruno-app/src/components/ResponsePane/Placeholder/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/Placeholder/StyledWrapper.js index 752144e17..bacc515a6 100644 --- a/packages/bruno-app/src/components/ResponsePane/Placeholder/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/Placeholder/StyledWrapper.js @@ -6,4 +6,3 @@ const StyledWrapper = styled.div` `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/ResponsePane/Placeholder/index.js b/packages/bruno-app/src/components/ResponsePane/Placeholder/index.js index cf30f60bd..4e7b3371a 100644 --- a/packages/bruno-app/src/components/ResponsePane/Placeholder/index.js +++ b/packages/bruno-app/src/components/ResponsePane/Placeholder/index.js @@ -5,8 +5,8 @@ import StyledWrapper from './StyledWrapper'; const Placeholder = () => { return ( -
      - +
      +
      diff --git a/packages/bruno-app/src/components/ResponsePane/QueryResult/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/QueryResult/StyledWrapper.js index b3d887ec3..9f7583222 100644 --- a/packages/bruno-app/src/components/ResponsePane/QueryResult/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/QueryResult/StyledWrapper.js @@ -8,4 +8,3 @@ const StyledWrapper = styled.div` `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js b/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js index c1e8a0aa8..d1f7ddad7 100644 --- a/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js +++ b/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js @@ -2,11 +2,11 @@ import React from 'react'; import CodeEditor from 'components/CodeEditor'; import StyledWrapper from './StyledWrapper'; -const QueryResult = ({value, width}) => { +const QueryResult = ({ value, width }) => { return ( - +
      - +
      ); diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js index 46fa11257..b670fcca4 100644 --- a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js +++ b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js @@ -1,7 +1,7 @@ import React from 'react'; import StyledWrapper from './StyledWrapper'; -const ResponseHeaders = ({headers}) => { +const ResponseHeaders = ({ headers }) => { return ( @@ -12,17 +12,19 @@ const ResponseHeaders = ({headers}) => { - {headers && headers.length ? headers.map((header, index) => { - return ( - - - - - ); - }) : null} + {headers && headers.length + ? headers.map((header, index) => { + return ( + + + + + ); + }) + : null}
      {header[0]}{header[1]}
      {header[0]}{header[1]}
      - ) + ); }; -export default ResponseHeaders; \ No newline at end of file +export default ResponseHeaders; diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseSize/index.js b/packages/bruno-app/src/components/ResponsePane/ResponseSize/index.js index b8cf461f8..c3c2f1fe3 100644 --- a/packages/bruno-app/src/components/ResponsePane/ResponseSize/index.js +++ b/packages/bruno-app/src/components/ResponsePane/ResponseSize/index.js @@ -1,21 +1,18 @@ import React from 'react'; import StyledWrapper from './StyledWrapper'; -const ResponseSize = ({size}) => { - let sizeToDisplay = '' +const ResponseSize = ({ size }) => { + let sizeToDisplay = ''; - if(size > 1024 ) { // size is greater than 1kb - let kb = Math.floor(size / 1024); - let decimal = ((size % 1024) / 1024).toFixed(2) * 100; - sizeToDisplay = kb + '.' + decimal + 'KB'; + if (size > 1024) { + // size is greater than 1kb + let kb = Math.floor(size / 1024); + let decimal = ((size % 1024) / 1024).toFixed(2) * 100; + sizeToDisplay = kb + '.' + decimal + 'KB'; } else { - sizeToDisplay = size + 'B' + sizeToDisplay = size + 'B'; } - return ( - - {sizeToDisplay} - - ) + return {sizeToDisplay}; }; -export default ResponseSize; \ No newline at end of file +export default ResponseSize; diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseTime/index.js b/packages/bruno-app/src/components/ResponsePane/ResponseTime/index.js index 1261f541c..ed05e944c 100644 --- a/packages/bruno-app/src/components/ResponsePane/ResponseTime/index.js +++ b/packages/bruno-app/src/components/ResponsePane/ResponseTime/index.js @@ -1,21 +1,18 @@ import React from 'react'; import StyledWrapper from './StyledWrapper'; -const ResponseTime = ({duration}) => { - let durationToDisplay = '' +const ResponseTime = ({ duration }) => { + let durationToDisplay = ''; - if(duration > 1000 ) { // duration greater than a second - let seconds = Math.floor(duration / 1000); - let decimal = ((duration % 1000) / 1000) * 100; - durationToDisplay = seconds + '.' + decimal.toFixed(0) + 's'; + if (duration > 1000) { + // duration greater than a second + let seconds = Math.floor(duration / 1000); + let decimal = ((duration % 1000) / 1000) * 100; + durationToDisplay = seconds + '.' + decimal.toFixed(0) + 's'; } else { - durationToDisplay = duration + 'ms' + durationToDisplay = duration + 'ms'; } - return ( - - {durationToDisplay} - - ) + return {durationToDisplay}; }; -export default ResponseTime; \ No newline at end of file +export default ResponseTime; diff --git a/packages/bruno-app/src/components/ResponsePane/StatusCode/get-status-code-phrase.js b/packages/bruno-app/src/components/ResponsePane/StatusCode/get-status-code-phrase.js index e5c7659fb..c90ff7cc7 100644 --- a/packages/bruno-app/src/components/ResponsePane/StatusCode/get-status-code-phrase.js +++ b/packages/bruno-app/src/components/ResponsePane/StatusCode/get-status-code-phrase.js @@ -41,7 +41,7 @@ const statusCodePhraseMap = { 415: 'Unsupported Media Type', 416: 'Range Not Satisfiable', 417: 'Expectation Failed', - 418: 'I\'m a teapot', + 418: "I'm a teapot", 421: 'Misdirected Request', 422: 'Unprocessable Entity', 423: 'Locked', diff --git a/packages/bruno-app/src/components/ResponsePane/StatusCode/index.js b/packages/bruno-app/src/components/ResponsePane/StatusCode/index.js index 0cd98091b..3bac108af 100644 --- a/packages/bruno-app/src/components/ResponsePane/StatusCode/index.js +++ b/packages/bruno-app/src/components/ResponsePane/StatusCode/index.js @@ -3,7 +3,7 @@ import classnames from 'classnames'; import statusCodePhraseMap from './get-status-code-phrase'; import StyledWrapper from './StyledWrapper'; -const StatusCode = ({status}) => { +const StatusCode = ({ status }) => { const getTabClassname = () => { return classnames('', { 'text-blue-700': status >= 100 && status < 200, @@ -18,6 +18,6 @@ const StatusCode = ({status}) => { {status} {statusCodePhraseMap[status]} - ) + ); }; -export default StatusCode; \ No newline at end of file +export default StatusCode; diff --git a/packages/bruno-app/src/components/ResponsePane/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/StyledWrapper.js index 70e63168a..4f7edd43a 100644 --- a/packages/bruno-app/src/components/ResponsePane/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/StyledWrapper.js @@ -10,7 +10,11 @@ const StyledWrapper = styled.div` color: var(--color-tab-inactive); cursor: pointer; - &:focus, &:active, &:focus-within, &:focus-visible, &:target { + &:focus, + &:active, + &:focus-within, + &:focus-visible, + &:target { outline: none !important; box-shadow: none !important; } @@ -23,4 +27,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/ResponsePane/index.js b/packages/bruno-app/src/components/ResponsePane/index.js index 654ac4f59..ace848842 100644 --- a/packages/bruno-app/src/components/ResponsePane/index.js +++ b/packages/bruno-app/src/components/ResponsePane/index.js @@ -12,35 +12,30 @@ import ResponseTime from './ResponseTime'; import ResponseSize from './ResponseSize'; import StyledWrapper from './StyledWrapper'; -const ResponsePane = ({rightPaneWidth, item, collection}) => { +const ResponsePane = ({ rightPaneWidth, item, collection }) => { const dispatch = useDispatch(); const tabs = useSelector((state) => state.tabs.tabs); const activeTabUid = useSelector((state) => state.tabs.activeTabUid); const isLoading = item.response && item.response.state === 'sending'; const selectTab = (tab) => { - dispatch(updateResponsePaneTab({ - uid: item.uid, - responsePaneTab: tab - })) + dispatch( + updateResponsePaneTab({ + uid: item.uid, + responsePaneTab: tab + }) + ); }; const response = item.response || {}; const getTabPanel = (tab) => { - switch(tab) { + switch (tab) { case 'response': { - return ( - - ); + return ; } case 'headers': { - return ( - - ); + return ; } default: { @@ -49,15 +44,15 @@ const ResponsePane = ({rightPaneWidth, item, collection}) => { } }; - if(isLoading) { + if (isLoading) { return ( - + ); } - if(response.state !== 'success') { + if (response.state !== 'success') { return ( @@ -65,43 +60,41 @@ const ResponsePane = ({rightPaneWidth, item, collection}) => { ); } - if(!activeTabUid) { - return ( -
      Something went wrong
      - ); + if (!activeTabUid) { + return
      Something went wrong
      ; } const focusedTab = find(tabs, (t) => t.uid === activeTabUid); - if(!focusedTab || !focusedTab.uid || !focusedTab.responsePaneTab) { - return ( -
      An error occured!
      - ); + if (!focusedTab || !focusedTab.uid || !focusedTab.responsePaneTab) { + return
      An error occured!
      ; } const getTabClassname = (tabName) => { return classnames(`tab select-none ${tabName}`, { - 'active': tabName === focusedTab.responsePaneTab + active: tabName === focusedTab.responsePaneTab }); }; return (
      -
      selectTab('response')}>Response
      -
      selectTab('headers')}>Headers
      +
      selectTab('response')}> + Response +
      +
      selectTab('headers')}> + Headers +
      {!isLoading ? (
      - - - + + +
      - ) : null } + ) : null}
      -
      - {getTabPanel(focusedTab.responsePaneTab)} -
      +
      {getTabPanel(focusedTab.responsePaneTab)}
       - ) + ); }; export default ResponsePane; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js index 40cce1a83..9e3e9ecd5 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js @@ -6,20 +6,17 @@ import { useDispatch } from 'react-redux'; import { isItemAFolder } from 'utils/tabs'; import { cloneItem } from 'providers/ReduxStore/slices/collections/actions'; -const CloneCollectionItem = ({collection, item, onClose}) => { +const CloneCollectionItem = ({ collection, item, onClose }) => { const dispatch = useDispatch(); const isFolder = isItemAFolder(item); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { name: item.name }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(cloneItem(values.name, item.uid, collection.uid)); @@ -28,7 +25,7 @@ const CloneCollectionItem = ({collection, item, onClose}) => { }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -36,27 +33,26 @@ const CloneCollectionItem = ({collection, item, onClose}) => { const onSubmit = () => formik.handleSubmit(); return ( - +
      - + - {formik.touched.name && formik.errors.name ? ( -
      {formik.errors.name}
      - ) : null} + {formik.touched.name && formik.errors.name ?
      {formik.errors.name}
      : null}
      diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/DeleteCollectionItem/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/DeleteCollectionItem/index.js index a84beb499..2f6fe108d 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/DeleteCollectionItem/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/DeleteCollectionItem/index.js @@ -7,34 +7,31 @@ import { deleteItem } from 'providers/ReduxStore/slices/collections/actions'; import { recursivelyGetAllItemUids } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; -const DeleteCollectionItem = ({onClose, item, collection}) => { +const DeleteCollectionItem = ({ onClose, item, collection }) => { const dispatch = useDispatch(); const isFolder = isItemAFolder(item); - const onConfirm = () =>{ - dispatch(deleteItem(item.uid, collection.uid)) - .then(() => { - if(isFolder) { - dispatch(closeTabs({ + const onConfirm = () => { + dispatch(deleteItem(item.uid, collection.uid)).then(() => { + if (isFolder) { + dispatch( + closeTabs({ tabUids: recursivelyGetAllItemUids(item.items) - })); - } else { - dispatch(closeTabs({ + }) + ); + } else { + dispatch( + closeTabs({ tabUids: [item.uid] - })); - } - }); + }) + ); + } + }); onClose(); }; return ( - + Are you sure you want to delete {item.name} ? diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js index c6d610cfc..ce8d2f9bf 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js @@ -6,20 +6,17 @@ import { useDispatch } from 'react-redux'; import { isItemAFolder } from 'utils/tabs'; import { renameItem } from 'providers/ReduxStore/slices/collections/actions'; -const RenameCollectionItem = ({collection, item, onClose}) => { +const RenameCollectionItem = ({ collection, item, onClose }) => { const dispatch = useDispatch(); const isFolder = isItemAFolder(item); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { name: item.name }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(renameItem(values.name, item.uid, collection.uid)); @@ -28,7 +25,7 @@ const RenameCollectionItem = ({collection, item, onClose}) => { }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -36,27 +33,26 @@ const RenameCollectionItem = ({collection, item, onClose}) => { const onSubmit = () => formik.handleSubmit(); return ( - +
      - + - {formik.touched.name && formik.errors.name ? ( -
      {formik.errors.name}
      - ) : null} + {formik.touched.name && formik.errors.name ?
      {formik.errors.name}
      : null}
      diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/StyledWrapper.js index c006a56aa..7fb461ff3 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/StyledWrapper.js @@ -12,13 +12,27 @@ const Wrapper = styled.div` top: 1px; } - .method-get { color: var(--color-method-get);} - .method-post { color: var(--color-method-post);} - .method-put { color: var(--color-method-put);} - .method-delete { color: var(--color-method-delete);} - .method-patch { color: var(--color-method-patch);} - .method-options { color: var(--color-method-options);} - .method-head { color: var(--color-method-head);} + .method-get { + color: var(--color-method-get); + } + .method-post { + color: var(--color-method-post); + } + .method-put { + color: var(--color-method-put); + } + .method-delete { + color: var(--color-method-delete); + } + .method-patch { + color: var(--color-method-patch); + } + .method-options { + color: var(--color-method-options); + } + .method-head { + color: var(--color-method-head); + } `; export default Wrapper; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/index.js index 1b2ff6f43..a408fc81e 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RequestMethod/index.js @@ -2,14 +2,14 @@ import React from 'react'; import classnames from 'classnames'; import StyledWrapper from './StyledWrapper'; -const RequestMethod = ({item}) => { - if(!['http-request', 'graphql-request'].includes(item.type)) { +const RequestMethod = ({ item }) => { + if (!['http-request', 'graphql-request'].includes(item.type)) { return null; } const getClassname = (method = '') => { method = method.toLocaleLowerCase(); - return classnames("mr-1", { + return classnames('mr-1', { 'method-get': method === 'get', 'method-post': method === 'post', 'method-put': method === 'put', diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/StyledWrapper.js index dd8fa6968..fb7ca9a26 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/StyledWrapper.js @@ -4,11 +4,11 @@ const Wrapper = styled.div` .menu-icon { color: rgb(110 110 110); - .dropdown { - div[aria-expanded="true"] { + .dropdown { + div[aria-expanded='true'] { visibility: visible; } - div[aria-expanded="false"] { + div[aria-expanded='false'] { visibility: hidden; } } @@ -37,7 +37,7 @@ const Wrapper = styled.div` background: #e7e7e7; .menu-icon { .dropdown { - div[aria-expanded="false"] { + div[aria-expanded='false'] { visibility: visible; } } diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js index e46b0ba8c..56c70f0ab 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js @@ -19,7 +19,7 @@ import { hideHomePage } from 'providers/ReduxStore/slices/app'; import StyledWrapper from './StyledWrapper'; -const CollectionItem = ({item, collection, searchText}) => { +const CollectionItem = ({ item, collection, searchText }) => { const tabs = useSelector((state) => state.tabs.tabs); const activeTabUid = useSelector((state) => state.tabs.activeTabUid); const isDragging = useSelector((state) => state.app.isDragging); @@ -44,7 +44,7 @@ const CollectionItem = ({item, collection, searchText}) => { const MenuIcon = forwardRef((props, ref) => { return (
      - +
      ); }); @@ -58,43 +58,49 @@ const CollectionItem = ({item, collection, searchText}) => { }); const handleClick = (event) => { - if(isItemARequest(item)) { - if(itemIsOpenedInTabs(item, tabs)) { - dispatch(focusTab({ - uid: item.uid - })); + if (isItemARequest(item)) { + if (itemIsOpenedInTabs(item, tabs)) { + dispatch( + focusTab({ + uid: item.uid + }) + ); } else { - dispatch(addTab({ - uid: item.uid, - collectionUid: collection.uid - })); + dispatch( + addTab({ + uid: item.uid, + collectionUid: collection.uid + }) + ); } dispatch(hideHomePage()); } else { - dispatch(collectionFolderClicked({ - itemUid: item.uid, - collectionUid: collection.uid - })); + dispatch( + collectionFolderClicked({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); } }; let indents = range(item.depth); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const isFolder = isItemAFolder(item); const className = classnames('flex flex-col w-full', { 'is-dragging': isDragging }); - if(searchText && searchText.length) { - if(isItemARequest(item)) { - if(!doesRequestMatchSearchText(item, searchText)) { + if (searchText && searchText.length) { + if (isItemARequest(item)) { + if (!doesRequestMatchSearchText(item, searchText)) { return null; } } else { if (!doesFolderHaveItemsMatchSearchText(item, searchText)) { return null; - }; + } } } @@ -103,83 +109,100 @@ const CollectionItem = ({item, collection, searchText}) => { return ( - {renameItemModalOpen && setRenameItemModalOpen(false)}/>} - {cloneItemModalOpen && setCloneItemModalOpen(false)}/>} - {deleteItemModalOpen && setDeleteItemModalOpen(false)}/>} - {newRequestModalOpen && setNewRequestModalOpen(false)}/>} - {newFolderModalOpen && setNewFolderModalOpen(false)}/>} + {renameItemModalOpen && setRenameItemModalOpen(false)} />} + {cloneItemModalOpen && setCloneItemModalOpen(false)} />} + {deleteItemModalOpen && setDeleteItemModalOpen(false)} />} + {newRequestModalOpen && setNewRequestModalOpen(false)} />} + {newFolderModalOpen && setNewFolderModalOpen(false)} />}
      - {indents && indents.length ? indents.map((i) => { - return ( -
      -  {/* Indent */} -
      - ); - }) : null} + {indents && indents.length + ? indents.map((i) => { + return ( +
      +  {/* Indent */} +
      + ); + }) + : null}
      -
      - {isFolder ? ( - - ) : null} +
      + {isFolder ? : null}
      - +
      - - {item.name} + + + {item.name} +
      - } placement='bottom-start'> + } placement="bottom-start"> {isFolder && ( <> -
      { - dropdownTippyRef.current.hide(); - setNewRequestModalOpen(true); - }}> +
      { + dropdownTippyRef.current.hide(); + setNewRequestModalOpen(true); + }} + > New Request
      -
      { - dropdownTippyRef.current.hide(); - setNewFolderModalOpen(true); - }}> +
      { + dropdownTippyRef.current.hide(); + setNewFolderModalOpen(true); + }} + > New Folder
      )} -
      { - dropdownTippyRef.current.hide(); - setRenameItemModalOpen(true); - }}> +
      { + dropdownTippyRef.current.hide(); + setRenameItemModalOpen(true); + }} + > Rename
      {!isFolder && ( -
      { - dropdownTippyRef.current.hide(); - setCloneItemModalOpen(true); - }}> +
      { + dropdownTippyRef.current.hide(); + setCloneItemModalOpen(true); + }} + > Clone
      )} -
      { - dropdownTippyRef.current.hide(); - setDeleteItemModalOpen(true); - }}> +
      { + dropdownTippyRef.current.hide(); + setDeleteItemModalOpen(true); + }} + > Delete
      @@ -189,26 +212,20 @@ const CollectionItem = ({item, collection, searchText}) => { {!itemIsCollapsed ? (
      - {requestItems && requestItems.length ? requestItems.map((i) => { - return - }) : null} - {folderItems && folderItems.length ? folderItems.map((i) => { - return - }) : null} + {requestItems && requestItems.length + ? requestItems.map((i) => { + return ; + }) + : null} + {folderItems && folderItems.length + ? folderItems.map((i) => { + return ; + }) + : null}
      ) : null} ); }; -export default CollectionItem; \ No newline at end of file +export default CollectionItem; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/DeleteCollection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/DeleteCollection/index.js index 27306bf96..dbab75a91 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/DeleteCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/DeleteCollection/index.js @@ -5,25 +5,19 @@ import { useDispatch } from 'react-redux'; import { deleteCollection } from 'providers/ReduxStore/slices/collections/actions'; import StyledWrapper from './StyledWrapper'; -const DeleteCollection = ({onClose, collection}) => { +const DeleteCollection = ({ onClose, collection }) => { const dispatch = useDispatch(); - const onConfirm = () =>{ + const onConfirm = () => { dispatch(deleteCollection(collection.uid)) .then(() => { - toast.success("Collection deleted"); + toast.success('Collection deleted'); }) - .catch(() => toast.error("An error occured while deleting the collection")); + .catch(() => toast.error('An error occured while deleting the collection')); }; return ( - + Are you sure you want to delete the collection {collection.name} ? diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveCollectionFromWorkspace/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveCollectionFromWorkspace/index.js index a5dbbf71b..5b22f0d4e 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveCollectionFromWorkspace/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveCollectionFromWorkspace/index.js @@ -7,30 +7,26 @@ import { removeCollectionFromWorkspace } from 'providers/ReduxStore/slices/works import { removeLocalCollection } from 'providers/ReduxStore/slices/collections/actions'; import { closeTabs } from 'providers/ReduxStore/slices/tabs'; -const RemoveCollectionFromWorkspace = ({onClose, collection}) => { +const RemoveCollectionFromWorkspace = ({ onClose, collection }) => { const dispatch = useDispatch(); const { activeWorkspaceUid } = useSelector((state) => state.workspaces); - const onConfirm = () =>{ + const onConfirm = () => { dispatch(removeCollectionFromWorkspace(activeWorkspaceUid, collection.uid)) .then(() => { - dispatch(closeTabs({ - tabUids: recursivelyGetAllItemUids(collection.items) - })); + dispatch( + closeTabs({ + tabUids: recursivelyGetAllItemUids(collection.items) + }) + ); }) .then(() => dispatch(removeLocalCollection(collection.uid))) - .then(() => toast.success("Collection removed from workspace")) - .catch((err) => console.log(err) && toast.error("An error occured while removing the collection")); + .then(() => toast.success('Collection removed from workspace')) + .catch((err) => console.log(err) && toast.error('An error occured while removing the collection')); }; return ( - + Are you sure you want to remove the collection {collection.name} from this workspace? ); diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveLocalCollection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveLocalCollection/index.js index bde7335a1..5de2eac2f 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveLocalCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RemoveLocalCollection/index.js @@ -4,26 +4,20 @@ import Modal from 'components/Modal'; import { useDispatch } from 'react-redux'; import { removeLocalCollection } from 'providers/ReduxStore/slices/collections/actions'; -const RemoveLocalCollection = ({onClose, collection}) => { +const RemoveLocalCollection = ({ onClose, collection }) => { const dispatch = useDispatch(); - const onConfirm = () =>{ + const onConfirm = () => { dispatch(removeLocalCollection(collection.uid)) .then(() => { - toast.success("Collection removed"); + toast.success('Collection removed'); onClose(); }) - .catch(() => toast.error("An error occured while removing the collection")); + .catch(() => toast.error('An error occured while removing the collection')); }; return ( - + Are you sure you want to remove this collection? ); diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RenameCollection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RenameCollection/index.js index 1db4a8381..9fd842b14 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/RenameCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/RenameCollection/index.js @@ -6,19 +6,16 @@ import { useDispatch } from 'react-redux'; import toast from 'react-hot-toast'; import { renameCollection } from 'providers/ReduxStore/slices/collections/actions'; -const RenameCollection = ({collection, onClose}) => { +const RenameCollection = ({ collection, onClose }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { name: collection.name }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(renameCollection(values.name, collection.uid)); @@ -28,7 +25,7 @@ const RenameCollection = ({collection, onClose}) => { }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -36,27 +33,26 @@ const RenameCollection = ({collection, onClose}) => { const onSubmit = () => formik.handleSubmit(); return ( - +
      - + - {formik.touched.name && formik.errors.name ? ( -
      {formik.errors.name}
      - ) : null} + {formik.touched.name && formik.errors.name ?
      {formik.errors.name}
      : null}
      diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/StyledWrapper.js index aa67c3697..3e3fc5f81 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/StyledWrapper.js @@ -14,14 +14,13 @@ const Wrapper = styled.div` .collection-actions { .dropdown { - div[aria-expanded="true"] { + div[aria-expanded='true'] { visibility: visible; } - div[aria-expanded="false"] { + div[aria-expanded='false'] { visibility: hidden; } } - svg { height: 22px; @@ -32,7 +31,7 @@ const Wrapper = styled.div` &:hover { .collection-actions { .dropdown { - div[aria-expanded="false"] { + div[aria-expanded='false'] { visibility: visible; } } diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/index.js index 95970925a..eec8ff4ea 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/index.js @@ -19,7 +19,7 @@ import RenameCollection from './RenameCollection'; import DeleteCollection from './DeleteCollection'; import StyledWrapper from './StyledWrapper'; -const Collection = ({collection, searchText}) => { +const Collection = ({ collection, searchText }) => { const [showNewFolderModal, setShowNewFolderModal] = useState(false); const [showNewRequestModal, setShowNewRequestModal] = useState(false); const [showRenameCollectionModal, setShowRenameCollectionModal] = useState(false); @@ -30,11 +30,11 @@ const Collection = ({collection, searchText}) => { const dispatch = useDispatch(); const menuDropdownTippyRef = useRef(); - const onMenuDropdownCreate = (ref) => menuDropdownTippyRef.current = ref; + const onMenuDropdownCreate = (ref) => (menuDropdownTippyRef.current = ref); const MenuIcon = forwardRef((props, ref) => { return (
      - +
      ); }); @@ -55,8 +55,8 @@ const Collection = ({collection, searchText}) => { dispatch(collectionClicked(collection.uid)); }; - if(searchText && searchText.length) { - if(!doesCollectionHaveItemsMatchingSearchText(collection, searchText)) { + if (searchText && searchText.length) { + if (!doesCollectionHaveItemsMatchingSearchText(collection, searchText)) { return null; } } @@ -73,69 +73,86 @@ const Collection = ({collection, searchText}) => { return ( - {showNewRequestModal && setShowNewRequestModal(false)}/>} - {showNewFolderModal && setShowNewFolderModal(false)}/>} - {showRenameCollectionModal && setShowRenameCollectionModal(false)}/>} - {showRemoveCollectionFromWSModal && setShowRemoveCollectionFromWSModal(false)}/>} - {showDeleteCollectionModal && setShowDeleteCollectionModal(false)}/>} - {showRemoveLocalCollectionModal && setShowRemoveLocalCollectionModal(false)}/>} + {showNewRequestModal && setShowNewRequestModal(false)} />} + {showNewFolderModal && setShowNewFolderModal(false)} />} + {showRenameCollectionModal && setShowRenameCollectionModal(false)} />} + {showRemoveCollectionFromWSModal && setShowRemoveCollectionFromWSModal(false)} />} + {showDeleteCollectionModal && setShowDeleteCollectionModal(false)} />} + {showRemoveLocalCollectionModal && setShowRemoveLocalCollectionModal(false)} />}
      - +
      {collection.name}
      -
      - } - placement='bottom-start' - > -
      { - menuDropdownTippyRef.current.hide(); - setShowNewRequestModal(true); - }}> +
      + } placement="bottom-start"> +
      { + menuDropdownTippyRef.current.hide(); + setShowNewRequestModal(true); + }} + > New Request
      -
      { - menuDropdownTippyRef.current.hide(); - setShowNewFolderModal(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + setShowNewFolderModal(true); + }} + > New Folder
      {!isLocal ? ( -
      { - menuDropdownTippyRef.current.hide(); - setShowRenameCollectionModal(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + setShowRenameCollectionModal(true); + }} + > Rename
      ) : null} -
      { - menuDropdownTippyRef.current.hide(); - handleExportClick(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + handleExportClick(true); + }} + > Export
      {!isLocal ? ( -
      { - menuDropdownTippyRef.current.hide(); - setShowRemoveCollectionFromWSModal(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + setShowRemoveCollectionFromWSModal(true); + }} + > Remove from Workspace
      ) : ( -
      { - menuDropdownTippyRef.current.hide(); - setShowRemoveLocalCollectionModal(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + setShowRemoveLocalCollectionModal(true); + }} + > Remove
      )} {!isLocal ? ( -
      { - menuDropdownTippyRef.current.hide(); - setShowDeleteCollectionModal(true); - }}> +
      { + menuDropdownTippyRef.current.hide(); + setShowDeleteCollectionModal(true); + }} + > Delete
      ) : null} @@ -146,23 +163,17 @@ const Collection = ({collection, searchText}) => {
      {!collectionIsCollapsed ? (
      - {requestItems && requestItems.length ? requestItems.map((i) => { - return - }) : null} + {requestItems && requestItems.length + ? requestItems.map((i) => { + return ; + }) + : null} - {folderItems && folderItems.length ? folderItems.map((i) => { - return - }) : null} + {folderItems && folderItems.length + ? folderItems.map((i) => { + return ; + }) + : null}
      ) : null}
      @@ -170,4 +181,4 @@ const Collection = ({collection, searchText}) => { ); }; -export default Collection; \ No newline at end of file +export default Collection; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/CreateOrAddCollection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/CreateOrAddCollection/index.js index 5e6c8505e..ad0bbf7fb 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/CreateOrAddCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/CreateOrAddCollection/index.js @@ -16,43 +16,42 @@ const CreateOrAddCollection = () => { setCreateCollectionModalOpen(false); dispatch(createCollection(values.collectionName)) .then(() => { - toast.success("Collection created"); + toast.success('Collection created'); }) - .catch(() => toast.error("An error occured while creating the collection")); + .catch(() => toast.error('An error occured while creating the collection')); }; const handleAddCollectionToWorkspace = (collectionUid) => { setAddCollectionToWSModalOpen(false); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collectionUid)) .then(() => { - toast.success("Collection added to workspace"); + toast.success('Collection added to workspace'); }) - .catch(() => toast.error("An error occured while adding collection to workspace")); + .catch(() => toast.error('An error occured while adding collection to workspace')); }; - const CreateLink = () => setCreateCollectionModalOpen(true)}>Create; - const AddLink = () => setAddCollectionToWSModalOpen(true)}>Add; + const CreateLink = () => ( + setCreateCollectionModalOpen(true)}> + Create + + ); + const AddLink = () => ( + setAddCollectionToWSModalOpen(true)}> + Add + + ); return ( -
      - {createCollectionModalOpen ? ( - setCreateCollectionModalOpen(false)} - handleConfirm={handleCreateCollection} - /> - ) : null} - - {addCollectionToWSModalOpen ? ( - setAddCollectionToWSModalOpen(false)} - onSelect={handleAddCollectionToWorkspace} - /> - ): null} +
      + {createCollectionModalOpen ? setCreateCollectionModalOpen(false)} handleConfirm={handleCreateCollection} /> : null} -
      + {addCollectionToWSModalOpen ? ( + setAddCollectionToWSModalOpen(false)} onSelect={handleAddCollectionToWorkspace} /> + ) : null} + +
      No collections found.
      -
      +
      or Collection to Workspace.
      @@ -60,4 +59,4 @@ const CreateOrAddCollection = () => { ); }; -export default CreateOrAddCollection; \ No newline at end of file +export default CreateOrAddCollection; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/StyledWrapper.js index b37adfb14..ce6f50e2e 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/StyledWrapper.js @@ -15,4 +15,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/index.js b/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/index.js index 73294cecb..a7cccf738 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/SelectCollection/index.js @@ -1,35 +1,32 @@ -import React from "react"; -import filter from "lodash/filter"; -import Modal from "components/Modal/index"; +import React from 'react'; +import filter from 'lodash/filter'; +import Modal from 'components/Modal/index'; import { IconFiles } from '@tabler/icons'; -import { useSelector } from "react-redux"; -import { isLocalCollection } from "utils/collections"; +import { useSelector } from 'react-redux'; +import { isLocalCollection } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; -const SelectCollection = ({onClose, onSelect, title}) => { +const SelectCollection = ({ onClose, onSelect, title }) => { const { collections } = useSelector((state) => state.collections); const collectionsToDisplay = filter(collections, (c) => !isLocalCollection(c)); return ( - -
        - {(collectionsToDisplay && collectionsToDisplay.length) ? collectionsToDisplay.map((c) => ( -
        onSelect(c.uid)}> - {c.name} -
        - )) : ( + +
          + {collectionsToDisplay && collectionsToDisplay.length ? ( + collectionsToDisplay.map((c) => ( +
          onSelect(c.uid)}> + {c.name} +
          + )) + ) : (
          No collections found
          )}
        ); -} +}; export default SelectCollection; diff --git a/packages/bruno-app/src/components/Sidebar/Collections/index.js b/packages/bruno-app/src/components/Sidebar/Collections/index.js index dfca61cc7..3d712c8c9 100644 --- a/packages/bruno-app/src/components/Sidebar/Collections/index.js +++ b/packages/bruno-app/src/components/Sidebar/Collections/index.js @@ -7,32 +7,30 @@ import CreateOrAddCollection from './CreateOrAddCollection'; import { findCollectionInWorkspace } from 'utils/workspaces'; import { isLocalCollection } from 'utils/collections'; -const Collections = ({searchText}) => { +const Collections = ({ searchText }) => { const { collections } = useSelector((state) => state.collections); const { workspaces, activeWorkspaceUid } = useSelector((state) => state.workspaces); - const activeWorkspace = find(workspaces, w => w.uid === activeWorkspaceUid); + const activeWorkspace = find(workspaces, (w) => w.uid === activeWorkspaceUid); - if(!activeWorkspace) { + if (!activeWorkspace) { return null; } const collectionToDisplay = filter(collections, (c) => findCollectionInWorkspace(activeWorkspace, c.uid) && !isLocalCollection(c)); - if(!collectionToDisplay || !collectionToDisplay.length) { + if (!collectionToDisplay || !collectionToDisplay.length) { return ; } return (
        - {collectionToDisplay && collectionToDisplay.length ? collectionToDisplay.map((c) => { - return - }) : null} + {collectionToDisplay && collectionToDisplay.length + ? collectionToDisplay.map((c) => { + return ; + }) + : null}
        ); }; -export default Collections; \ No newline at end of file +export default Collections; diff --git a/packages/bruno-app/src/components/Sidebar/CreateCollection/index.js b/packages/bruno-app/src/components/Sidebar/CreateCollection/index.js index e01fe1739..a168337e6 100644 --- a/packages/bruno-app/src/components/Sidebar/CreateCollection/index.js +++ b/packages/bruno-app/src/components/Sidebar/CreateCollection/index.js @@ -8,34 +8,31 @@ import { createCollection, createLocalCollection } from 'providers/ReduxStore/sl import toast from 'react-hot-toast'; import Modal from 'components/Modal'; -const CreateCollection = ({onClose, isLocal}) => { +const CreateCollection = ({ onClose, isLocal }) => { const inputRef = useRef(); const dispatch = useDispatch(); const isPlatformElectron = isElectron(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { collectionName: '', collectionLocation: '' }, validationSchema: Yup.object({ - collectionName: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + collectionName: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { const action = isLocal && isPlatformElectron ? createLocalCollection : createCollection; dispatch(action(values.collectionName, values.collectionLocation)) .then(() => { - toast.success("Collection created"); + toast.success('Collection created'); onClose(); }) - .catch(() => toast.error("An error occured while creating the collection")); + .catch(() => toast.error('An error occured while creating the collection')); } }); - + const browse = () => { dispatch(browserLocalDirectory()) .then((dirPath) => { @@ -48,7 +45,7 @@ const CreateCollection = ({onClose, isLocal}) => { }; useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -56,16 +53,12 @@ const CreateCollection = ({onClose, isLocal}) => { const onSubmit = () => formik.handleSubmit(); return ( - +
        - + { ref={inputRef} className="block textbox mt-2 w-full" onChange={formik.handleChange} - autoComplete="off" autoCorrect="off" autoCapitalize="off" spellCheck="false" + autoComplete="off" + autoCorrect="off" + autoCapitalize="off" + spellCheck="false" value={formik.values.collectionName || ''} /> - {formik.touched.collectionName && formik.errors.collectionName ? ( -
        {formik.errors.collectionName}
        - ) : null} + {formik.touched.collectionName && formik.errors.collectionName ?
        {formik.errors.collectionName}
        : null} {isLocal && isPlatformElectron ? ( <> - + @@ -101,9 +100,11 @@ const CreateCollection = ({onClose, isLocal}) => { {isLocal && isPlatformElectron ? (
        - Browse + + Browse +
        - ) : null } + ) : null}
        diff --git a/packages/bruno-app/src/components/Sidebar/LocalCollections/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/LocalCollections/StyledWrapper.js index c2d9a1ff9..aca131828 100644 --- a/packages/bruno-app/src/components/Sidebar/LocalCollections/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/LocalCollections/StyledWrapper.js @@ -2,7 +2,7 @@ import styled from 'styled-components'; const Wrapper = styled.div` .current-workspace { - margin-inline: .5rem; + margin-inline: 0.5rem; background: #e1e1e1; border-radius: 5px; diff --git a/packages/bruno-app/src/components/Sidebar/LocalCollections/index.js b/packages/bruno-app/src/components/Sidebar/LocalCollections/index.js index d6ae5e87d..99e708f97 100644 --- a/packages/bruno-app/src/components/Sidebar/LocalCollections/index.js +++ b/packages/bruno-app/src/components/Sidebar/LocalCollections/index.js @@ -9,7 +9,7 @@ import CreateCollection from '../CreateCollection'; import { isLocalCollection } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; -const LocalCollections = ({searchText}) => { +const LocalCollections = ({ searchText }) => { const dropdownTippyRef = useRef(); const dispatch = useDispatch(); const { collections } = useSelector((state) => state.collections); @@ -17,71 +17,60 @@ const LocalCollections = ({searchText}) => { const collectionToDisplay = filter(collections, (c) => isLocalCollection(c)); - if(!collectionToDisplay || !collectionToDisplay.length) { + if (!collectionToDisplay || !collectionToDisplay.length) { return null; } const Icon = forwardRef((props, ref) => { return (
        -
        - - - - - Local Collections +
        + + + Local Collections
        - +
        ); }); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; - + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const handleOpenLocalCollection = () => { - dispatch(openLocalCollection()) - .catch((err) => console.log(err) && toast.error("An error occured while opening the local collection")); - } + dispatch(openLocalCollection()).catch((err) => console.log(err) && toast.error('An error occured while opening the local collection')); + }; return ( - {createCollectionModalOpen ? ( - setCreateCollectionModalOpen(false)} - /> - ) : null} + {createCollectionModalOpen ? setCreateCollectionModalOpen(false)} /> : null}
        - } placement='bottom-end'> + } placement="bottom-end">
        setCreateCollectionModalOpen(true)}>
        - +
        Create Collection
        - +
        Open Collection
        -
        +
        Note: Local collections are not tied to a workspace
        - {collectionToDisplay && collectionToDisplay.length ? collectionToDisplay.map((c) => { - return - }) : null} + {collectionToDisplay && collectionToDisplay.length + ? collectionToDisplay.map((c) => { + return ; + }) + : null}
        ); diff --git a/packages/bruno-app/src/components/Sidebar/MenuBar/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/MenuBar/StyledWrapper.js index 1880b92bb..aa33e0dd6 100644 --- a/packages/bruno-app/src/components/Sidebar/MenuBar/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/MenuBar/StyledWrapper.js @@ -9,7 +9,8 @@ const Wrapper = styled.div` padding: 0.6rem; cursor: pointer; - &:hover, &.active { + &:hover, + &.active { color: rgba(255, 255, 255); } } diff --git a/packages/bruno-app/src/components/Sidebar/MenuBar/index.js b/packages/bruno-app/src/components/Sidebar/MenuBar/index.js index 1324338f5..cab633bb4 100644 --- a/packages/bruno-app/src/components/Sidebar/MenuBar/index.js +++ b/packages/bruno-app/src/components/Sidebar/MenuBar/index.js @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import Link from 'next/link'; import { useRouter } from 'next/router'; -import { IconCode, IconFiles, IconUser, IconUsers, IconSettings, IconChevronsLeft, IconLifebuoy} from '@tabler/icons'; +import { IconCode, IconFiles, IconUser, IconUsers, IconSettings, IconChevronsLeft, IconLifebuoy } from '@tabler/icons'; import { useDispatch } from 'react-redux'; import { toggleLeftMenuBar } from 'providers/ReduxStore/slices/app'; import BrunoSupport from 'components/BrunoSupport'; @@ -15,7 +15,7 @@ const MenuBar = () => { const isPlatformElectron = isElectron(); const getClassName = (menu) => { - return router.pathname === menu ? "active menu-item": "menu-item"; + return router.pathname === menu ? 'active menu-item' : 'menu-item'; }; return ( @@ -23,14 +23,14 @@ const MenuBar = () => {
        - +
        {!isPlatformElectron ? ( -
        - -
        +
        + +
        ) : null} {/*
        @@ -44,15 +44,15 @@ const MenuBar = () => {
        */}
        - setOpenBrunoSupport(true)}/> + setOpenBrunoSupport(true)} />
        dispatch(toggleLeftMenuBar())}> - +
        - {openBrunoSupport && setOpenBrunoSupport(false)}/>} + {openBrunoSupport && setOpenBrunoSupport(false)} />} ); }; -export default MenuBar; \ No newline at end of file +export default MenuBar; diff --git a/packages/bruno-app/src/components/Sidebar/NewFolder/index.js b/packages/bruno-app/src/components/Sidebar/NewFolder/index.js index 11b12f562..ab1ab7ba4 100644 --- a/packages/bruno-app/src/components/Sidebar/NewFolder/index.js +++ b/packages/bruno-app/src/components/Sidebar/NewFolder/index.js @@ -1,34 +1,31 @@ import React, { useRef, useEffect } from 'react'; -import {useFormik} from 'formik'; +import { useFormik } from 'formik'; import toast from 'react-hot-toast'; import * as Yup from 'yup'; import Modal from 'components/Modal'; import { useDispatch } from 'react-redux'; import { newFolder } from 'providers/ReduxStore/slices/collections/actions'; -const NewFolder = ({collection, item, onClose}) => { +const NewFolder = ({ collection, item, onClose }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { folderName: '' }, validationSchema: Yup.object({ - folderName: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + folderName: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(newFolder(values.folderName, collection.uid, item ? item.uid : null)) .then(() => onClose()) - .catch(() => toast.error("An error occured while adding the request")); + .catch(() => toast.error('An error occured while adding the request')); } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -36,27 +33,26 @@ const NewFolder = ({collection, item, onClose}) => { const onSubmit = () => formik.handleSubmit(); return ( - +
        - + - {formik.touched.folderName && formik.errors.folderName ? ( -
        {formik.errors.folderName}
        - ) : null} + {formik.touched.folderName && formik.errors.folderName ?
        {formik.errors.folderName}
        : null}
        diff --git a/packages/bruno-app/src/components/Sidebar/NewRequest/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/NewRequest/StyledWrapper.js index f22f6e4e7..19592f9ab 100644 --- a/packages/bruno-app/src/components/Sidebar/NewRequest/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/NewRequest/StyledWrapper.js @@ -13,7 +13,8 @@ const StyledWrapper = styled.div` } } - div.method-selector-container, div.input-container { + div.method-selector-container, + div.input-container { height: 2.3rem; } @@ -34,4 +35,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Sidebar/NewRequest/index.js b/packages/bruno-app/src/components/Sidebar/NewRequest/index.js index 394e4b4fd..9cc42c2da 100644 --- a/packages/bruno-app/src/components/Sidebar/NewRequest/index.js +++ b/packages/bruno-app/src/components/Sidebar/NewRequest/index.js @@ -2,7 +2,7 @@ import React, { useRef, useEffect } from 'react'; import { useFormik } from 'formik'; import * as Yup from 'yup'; import toast from 'react-hot-toast'; -import { uuid } from 'utils/common';; +import { uuid } from 'utils/common'; import Modal from 'components/Modal'; import { useDispatch } from 'react-redux'; import { newEphermalHttpRequest } from 'providers/ReduxStore/slices/collections'; @@ -11,11 +11,11 @@ import { addTab } from 'providers/ReduxStore/slices/tabs'; import HttpMethodSelector from 'components/RequestPane/QueryUrl/HttpMethodSelector'; import StyledWrapper from './StyledWrapper'; -const NewRequest = ({collection, item, isEphermal, onClose}) => { +const NewRequest = ({ collection, item, isEphermal, onClose }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { requestName: '', requestType: 'http-request', @@ -23,47 +23,50 @@ const NewRequest = ({collection, item, isEphermal, onClose}) => { requestMethod: 'GET' }, validationSchema: Yup.object({ - requestName: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(50, 'must be 50 characters or less') - .required('name is required') + requestName: Yup.string().min(1, 'must be atleast 1 characters').max(50, 'must be 50 characters or less').required('name is required') }), onSubmit: (values) => { - if(isEphermal) { + if (isEphermal) { const uid = uuid(); - dispatch(newEphermalHttpRequest({ - uid: uid, - requestName: values.requestName, - requestType: values.requestType, - requestUrl: values.requestUrl, - requestMethod: values.requestMethod, - collectionUid: collection.uid - })) + dispatch( + newEphermalHttpRequest({ + uid: uid, + requestName: values.requestName, + requestType: values.requestType, + requestUrl: values.requestUrl, + requestMethod: values.requestMethod, + collectionUid: collection.uid + }) + ) .then(() => { - dispatch(addTab({ - uid: uid, - collectionUid: collection.uid - })); + dispatch( + addTab({ + uid: uid, + collectionUid: collection.uid + }) + ); onClose(); }) - .catch(() => toast.error("An error occured while adding the request")); + .catch(() => toast.error('An error occured while adding the request')); } else { - dispatch(newHttpRequest({ - requestName: values.requestName, - requestType: values.requestType, - requestUrl: values.requestUrl, - requestMethod: values.requestMethod, - collectionUid: collection.uid, - itemUid: item ? item.uid : null - })) + dispatch( + newHttpRequest({ + requestName: values.requestName, + requestType: values.requestType, + requestUrl: values.requestUrl, + requestMethod: values.requestMethod, + collectionUid: collection.uid, + itemUid: item ? item.uid : null + }) + ) .then(() => onClose()) - .catch(() => toast.error("An error occured while adding the request")); + .catch(() => toast.error('An error occured while adding the request')); } } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); @@ -72,78 +75,90 @@ const NewRequest = ({collection, item, isEphermal, onClose}) => { return ( - +
        - +
        - + { - formik.setFieldValue('requestMethod', 'POST') + formik.setFieldValue('requestMethod', 'POST'); formik.handleChange(event); }} value="graphql" checked={formik.values.requestType === 'graphql-request'} /> - +
        - + - {formik.touched.requestName && formik.errors.requestName ? ( -
        {formik.errors.requestName}
        - ) : null} + {formik.touched.requestName && formik.errors.requestName ?
        {formik.errors.requestName}
        : null}
        - +
        - formik.setFieldValue('requestMethod', val)}/> + formik.setFieldValue('requestMethod', val)} />
        - {formik.touched.requestUrl && formik.errors.requestUrl ? ( -
        {formik.errors.requestUrl}
        - ) : null} + {formik.touched.requestUrl && formik.errors.requestUrl ?
        {formik.errors.requestUrl}
        : null}
        diff --git a/packages/bruno-app/src/components/Sidebar/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/StyledWrapper.js index a2ea46120..df2e5cab1 100644 --- a/packages/bruno-app/src/components/Sidebar/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/StyledWrapper.js @@ -37,7 +37,7 @@ const Wrapper = styled.div` width: 6px; right: -3px; - &:hover div.drag-request-border{ + &:hover div.drag-request-border { width: 2px; height: 100%; border-left: solid 1px var(--color-request-dragbar-background-active); diff --git a/packages/bruno-app/src/components/Sidebar/TitleBar/StyledWrapper.js b/packages/bruno-app/src/components/Sidebar/TitleBar/StyledWrapper.js index dfdcab3db..91b434873 100644 --- a/packages/bruno-app/src/components/Sidebar/TitleBar/StyledWrapper.js +++ b/packages/bruno-app/src/components/Sidebar/TitleBar/StyledWrapper.js @@ -25,4 +25,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Sidebar/TitleBar/index.js b/packages/bruno-app/src/components/Sidebar/TitleBar/index.js index 737e46b0a..8918920e7 100644 --- a/packages/bruno-app/src/components/Sidebar/TitleBar/index.js +++ b/packages/bruno-app/src/components/Sidebar/TitleBar/index.js @@ -23,11 +23,11 @@ const TitleBar = () => { const dispatch = useDispatch(); const menuDropdownTippyRef = useRef(); - const onMenuDropdownCreate = (ref) => menuDropdownTippyRef.current = ref; + const onMenuDropdownCreate = (ref) => (menuDropdownTippyRef.current = ref); const MenuIcon = forwardRef((props, ref) => { return (
        - +
        ); }); @@ -35,23 +35,22 @@ const TitleBar = () => { const handleTitleClick = () => dispatch(showHomePage()); const handleOpenLocalCollection = () => { - dispatch(openLocalCollection()) - .catch((err) => console.log(err) && toast.error("An error occured while opening the local collection")); - } + dispatch(openLocalCollection()).catch((err) => console.log(err) && toast.error('An error occured while opening the local collection')); + }; const handleAddCollectionToWorkspace = (collectionUid) => { setAddCollectionToWSModalOpen(false); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collectionUid)) .then(() => { - toast.success("Collection added to workspace"); + toast.success('Collection added to workspace'); }) - .catch(() => toast.error("An error occured while adding collection to workspace")); + .catch(() => toast.error('An error occured while adding collection to workspace')); }; const handleImportCollection = () => { importCollection() .then((collection) => { - dispatch(collectionImported({collection: collection})); + dispatch(collectionImported({ collection: collection })); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid)); }) .catch((err) => console.log(err)); @@ -59,20 +58,11 @@ const TitleBar = () => { return ( - {createCollectionModalOpen ? ( - setCreateCollectionModalOpen(false)} - /> - ) : null} - + {createCollectionModalOpen ? setCreateCollectionModalOpen(false)} /> : null} + {addCollectionToWSModalOpen ? ( - setAddCollectionToWSModalOpen(false)} - onSelect={handleAddCollectionToWorkspace} - /> - ): null} + setAddCollectionToWSModalOpen(false)} onSelect={handleAddCollectionToWorkspace} /> + ) : null}
        @@ -81,52 +71,65 @@ const TitleBar = () => {
        bruno
        - } placement='bottom-start'> -
        { - menuDropdownTippyRef.current.hide(); - setCreateCollectionModalOpen(true); - }}> + } placement="bottom-start"> +
        { + menuDropdownTippyRef.current.hide(); + setCreateCollectionModalOpen(true); + }} + > Create Collection
        -
        { - menuDropdownTippyRef.current.hide(); - handleImportCollection(); - }}> +
        { + menuDropdownTippyRef.current.hide(); + handleImportCollection(); + }} + > Import Collection
        -
        { - menuDropdownTippyRef.current.hide(); - setAddCollectionToWSModalOpen(true); - }}> +
        { + menuDropdownTippyRef.current.hide(); + setAddCollectionToWSModalOpen(true); + }} + > Add Collection to Workspace
        {isPlatformElectron ? ( <>
        -
        - - - - - Local Collections +
        + + + Local Collections
        -
        { - setCreateCollectionModalOpen('local'); - menuDropdownTippyRef.current.hide(); - }}> +
        { + setCreateCollectionModalOpen('local'); + menuDropdownTippyRef.current.hide(); + }} + > Create Local Collection
        -
        { - handleOpenLocalCollection(); - menuDropdownTippyRef.current.hide(); - }}> +
        { + handleOpenLocalCollection(); + menuDropdownTippyRef.current.hide(); + }} + > Open Local Collection
        @@ -135,12 +138,11 @@ const TitleBar = () => { Note: Local collections are only available on the desktop app.
        )} -
        - ) + ); }; export default TitleBar; diff --git a/packages/bruno-app/src/components/Sidebar/index.js b/packages/bruno-app/src/components/Sidebar/index.js index bb68fb30f..e92d8696e 100644 --- a/packages/bruno-app/src/components/Sidebar/index.js +++ b/packages/bruno-app/src/components/Sidebar/index.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect} from 'react'; +import React, { useState, useEffect } from 'react'; import { useSelector, useDispatch } from 'react-redux'; import Collections from './Collections'; import LocalCollections from './LocalCollections'; @@ -23,33 +23,39 @@ const Sidebar = () => { const [searchText, setSearchText] = useState(''); const handleMouseMove = (e) => { - if(dragging) { + if (dragging) { e.preventDefault(); let width = e.clientX + 2; - if(width < MIN_LEFT_SIDEBAR_WIDTH || width > MAX_LEFT_SIDEBAR_WIDTH) { + if (width < MIN_LEFT_SIDEBAR_WIDTH || width > MAX_LEFT_SIDEBAR_WIDTH) { return; } setAsideWidth(width); } }; const handleMouseUp = (e) => { - if(dragging) { + if (dragging) { e.preventDefault(); setDragging(false); - dispatch(updateLeftSidebarWidth({ - leftSidebarWidth: asideWidth - })); - dispatch(updateIsDragging({ - isDragging: false - })); + dispatch( + updateLeftSidebarWidth({ + leftSidebarWidth: asideWidth + }) + ); + dispatch( + updateIsDragging({ + isDragging: false + }) + ); } }; const handleDragbarMouseDown = (e) => { e.preventDefault(); setDragging(true); - dispatch(updateIsDragging({ - isDragging: true - })); + dispatch( + updateIsDragging({ + isDragging: true + }) + ); }; useEffect(() => { @@ -68,7 +74,7 @@ const Sidebar = () => { return ( -
        @@ -120,4 +134,4 @@ const Sidebar = () => { ); }; -export default Sidebar; \ No newline at end of file +export default Sidebar; diff --git a/packages/bruno-app/src/components/Spinner/StyledWrapper.js b/packages/bruno-app/src/components/Spinner/StyledWrapper.js index fa22a395a..aff2b75da 100644 --- a/packages/bruno-app/src/components/Spinner/StyledWrapper.js +++ b/packages/bruno-app/src/components/Spinner/StyledWrapper.js @@ -9,9 +9,8 @@ const StyledWrapper = styled.div` border: 0.25em solid currentColor; border-right-color: transparent; border-radius: 50%; - animation: spinner-border .75s linear infinite; + animation: spinner-border 0.75s linear infinite; } `; export default StyledWrapper; - diff --git a/packages/bruno-app/src/components/Spinner/index.js b/packages/bruno-app/src/components/Spinner/index.js index a8ceec45b..e2ae3181c 100644 --- a/packages/bruno-app/src/components/Spinner/index.js +++ b/packages/bruno-app/src/components/Spinner/index.js @@ -2,17 +2,13 @@ import React from 'react'; import StyledWrapper from './StyledWrapper'; // Todo: Size, Color config support -const Spinner = ({size, color, children}) => { +const Spinner = ({ size, color, children }) => { return (
        - {children && -
        - {children} -
        - } + {children &&
        {children}
        }         - ) + ); }; export default Spinner; diff --git a/packages/bruno-app/src/components/StopWatch/index.js b/packages/bruno-app/src/components/StopWatch/index.js index 304b6ac88..49bd8c175 100644 --- a/packages/bruno-app/src/components/StopWatch/index.js +++ b/packages/bruno-app/src/components/StopWatch/index.js @@ -15,16 +15,12 @@ const StopWatch = () => { }; }); - if(milliseconds < 1000) { + if (milliseconds < 1000) { return 'Loading...'; } - let seconds = milliseconds/1000; - return ( - - {seconds.toFixed(1)}s - - ) + let seconds = milliseconds / 1000; + return {seconds.toFixed(1)}s; }; export default StopWatch; diff --git a/packages/bruno-app/src/components/Toast/StyledWrapper.js b/packages/bruno-app/src/components/Toast/StyledWrapper.js index 77f9aad27..e06a2a058 100644 --- a/packages/bruno-app/src/components/Toast/StyledWrapper.js +++ b/packages/bruno-app/src/components/Toast/StyledWrapper.js @@ -12,16 +12,16 @@ const Wrapper = styled.div` } .bruno-toast-card { - -webkit-animation-duration: .85s; - animation-duration: .85s; - -webkit-animation-delay: .1s; - animation-delay: .1s; + -webkit-animation-duration: 0.85s; + animation-duration: 0.85s; + -webkit-animation-delay: 0.1s; + animation-delay: 0.1s; border-radius: var(--border-radius); position: relative; max-width: calc(100% - var(--spacing-base-unit)); margin: 3vh 10vw; - animation: fade-and-slide-in-from-top .50s forwards cubic-bezier(.19,1,.22,1); + animation: fade-and-slide-in-from-top 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1); } .notification-toast-content { @@ -34,9 +34,9 @@ const Wrapper = styled.div` .alert { position: relative; - padding: .25rem .75rem; + padding: 0.25rem 0.75rem; border: 1px solid transparent; - border-radius: .25rem; + border-radius: 0.25rem; display: flex; justify-content: space-between; } diff --git a/packages/bruno-app/src/components/Toast/index.js b/packages/bruno-app/src/components/Toast/index.js index 4276f3362..243b9a364 100644 --- a/packages/bruno-app/src/components/Toast/index.js +++ b/packages/bruno-app/src/components/Toast/index.js @@ -1,34 +1,29 @@ -import React, {useEffect} from 'react'; +import React, { useEffect } from 'react'; import StyledWrapper from './StyledWrapper'; -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faTimes } from "@fortawesome/free-solid-svg-icons"; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faTimes } from '@fortawesome/free-solid-svg-icons'; -const ToastContent = ({type, text, handleClose}) => ( +const ToastContent = ({ type, text, handleClose }) => (
        {text}
        -
        - +
        +
        ); -const Toast = ({ - text, - type, - duration, - handleClose -}) => { +const Toast = ({ text, type, duration, handleClose }) => { let lifetime = duration ? duration : 3000; useEffect(() => { - if(text) { + if (text) { setTimeout(handleClose, lifetime); } }, [text]); return ( - -
        + +
        diff --git a/packages/bruno-app/src/components/Welcome/index.js b/packages/bruno-app/src/components/Welcome/index.js index 10fd70d9d..c6d08026e 100644 --- a/packages/bruno-app/src/components/Welcome/index.js +++ b/packages/bruno-app/src/components/Welcome/index.js @@ -1,15 +1,6 @@ import React, { useState } from 'react'; import toast from 'react-hot-toast'; -import { - IconPlus, - IconUpload, - IconFiles, - IconFolders, - IconPlayerPlay, - IconBrandChrome, - IconSpeakerphone, - IconDeviceDesktop -} from '@tabler/icons'; +import { IconPlus, IconUpload, IconFiles, IconFolders, IconPlayerPlay, IconBrandChrome, IconSpeakerphone, IconDeviceDesktop } from '@tabler/icons'; import { useSelector, useDispatch } from 'react-redux'; import { collectionImported } from 'providers/ReduxStore/slices/collections'; import { openLocalCollection } from 'providers/ReduxStore/slices/collections/actions'; @@ -33,15 +24,15 @@ const Welcome = () => { setAddCollectionToWSModalOpen(false); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collectionUid)) .then(() => { - toast.success("Collection added to workspace"); + toast.success('Collection added to workspace'); }) - .catch(() => toast.error("An error occured while adding collection to workspace")); + .catch(() => toast.error('An error occured while adding collection to workspace')); }; const handleImportCollection = () => { importCollection() .then((collection) => { - dispatch(collectionImported({collection: collection})); + dispatch(collectionImported({ collection: collection })); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid)); }) .catch((err) => console.log(err)); @@ -50,37 +41,27 @@ const Welcome = () => { const handleImportSampleCollection = () => { importSampleCollection() .then((collection) => { - dispatch(collectionImported({collection: collection})); + dispatch(collectionImported({ collection: collection })); dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid)); }) - .then(() => toast.success("Sample Collection loaded successfully")) + .then(() => toast.success('Sample Collection loaded successfully')) .catch((err) => { - toast.error("Load sample collection failed"); + toast.error('Load sample collection failed'); console.log(err); }); }; const handleOpenLocalCollection = () => { - dispatch(openLocalCollection()) - .catch((err) => console.log(err) && toast.error("An error occured while opening the local collection")); - } + dispatch(openLocalCollection()).catch((err) => console.log(err) && toast.error('An error occured while opening the local collection')); + }; return ( - {createCollectionModalOpen ? ( - setCreateCollectionModalOpen(false)} - /> - ) : null} - + {createCollectionModalOpen ? setCreateCollectionModalOpen(false)} /> : null} + {addCollectionToWSModalOpen ? ( - setAddCollectionToWSModalOpen(false)} - onSelect={handleAddCollectionToWorkspace} - /> - ): null} + setAddCollectionToWSModalOpen(false)} onSelect={handleAddCollectionToWorkspace} /> + ) : null}
        @@ -91,16 +72,24 @@ const Welcome = () => {
        Collections
        - setCreateCollectionModalOpen(true)}>Create Collection + + setCreateCollectionModalOpen(true)}> + Create Collection +
        - setAddCollectionToWSModalOpen(true)}>Add Collection to Workspace + + setAddCollectionToWSModalOpen(true)}> + Add Collection to Workspace +
        - Import Collection + + Import Collection
        - Load Sample Collection + + Load Sample Collection
        @@ -108,33 +97,40 @@ const Welcome = () => { {isPlatformElectron ? (
        - setCreateCollectionModalOpen('local')}>Create Collection + + setCreateCollectionModalOpen('local')}> + Create Collection +
        - Open Collection + + + Open Collection +
        ) : ( -
        - Local collections are only available on the desktop app. -
        +
        Local collections are only available on the desktop app.
        )}
        Links
        - - ) + ); }; export default Welcome; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/AddWorkspace/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/AddWorkspace/index.js index a8a8f9875..02934b1fd 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/AddWorkspace/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/AddWorkspace/index.js @@ -1,75 +1,70 @@ import React, { useEffect, useRef } from 'react'; -import Portal from "components/Portal/index"; -import Modal from "components/Modal/index"; +import Portal from 'components/Portal/index'; +import Modal from 'components/Modal/index'; import { useFormik } from 'formik'; import { addWorkspace } from 'providers/ReduxStore/slices/workspaces/actions'; import * as Yup from 'yup'; import { useDispatch } from 'react-redux'; import toast from 'react-hot-toast'; -const AddWorkspace = ({onClose}) => { +const AddWorkspace = ({ onClose }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { - name: "" + name: '' }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(30, 'must be 30 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(30, 'must be 30 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(addWorkspace(values.name)) .then(() => { - toast.success("Workspace created!"); + toast.success('Workspace created!'); onClose(); }) - .catch(() => toast.error("An error occured while creating the workspace")); + .catch(() => toast.error('An error occured while creating the workspace')); } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); const onSubmit = () => { formik.handleSubmit(); - } + }; return ( - +
        - + - {formik.touched.name && formik.errors.name ? ( -
        {formik.errors.name}
        - ) : null} + {formik.touched.name && formik.errors.name ?
        {formik.errors.name}
        : null}
        -         +         ); -} +}; export default AddWorkspace; - diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/DeleteWorkspace/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/DeleteWorkspace/index.js index 20f03f871..73eb691b4 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/DeleteWorkspace/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/DeleteWorkspace/index.js @@ -1,39 +1,31 @@ import React from 'react'; -import Portal from "components/Portal/index"; -import Modal from "components/Modal/index"; +import Portal from 'components/Portal/index'; +import Modal from 'components/Modal/index'; import { deleteWorkspace } from 'providers/ReduxStore/slices/workspaces/actions'; import { useDispatch } from 'react-redux'; import toast from 'react-hot-toast'; import StyledWrapper from './StyledWrapper'; -const DeleteWorkspace = ({onClose, workspace}) => { +const DeleteWorkspace = ({ onClose, workspace }) => { const dispatch = useDispatch(); - const onConfirm = () =>{ + const onConfirm = () => { dispatch(deleteWorkspace(workspace.uid)) - .then(() => { - toast.success("Workspace deleted!"); - onClose(); - }) - .catch(() => toast.error("An error occured while deleting the workspace")); + .then(() => { + toast.success('Workspace deleted!'); + onClose(); + }) + .catch(() => toast.error('An error occured while deleting the workspace')); }; return ( - - - - Are you sure you want to delete {workspace.name} ? - - - - + + + + Are you sure you want to delete {workspace.name} ? + + + ); -} +}; export default DeleteWorkspace; - diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/EditWorkspace/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/EditWorkspace/index.js index 60573ef01..9e0a07a11 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/EditWorkspace/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/EditWorkspace/index.js @@ -1,75 +1,70 @@ import React, { useEffect, useRef } from 'react'; -import Portal from "components/Portal/index"; -import Modal from "components/Modal/index"; +import Portal from 'components/Portal/index'; +import Modal from 'components/Modal/index'; import { useFormik } from 'formik'; import { renameWorkspace } from 'providers/ReduxStore/slices/workspaces/actions'; import * as Yup from 'yup'; import { useDispatch } from 'react-redux'; import toast from 'react-hot-toast'; -const EditWorkspace = ({onClose, workspace}) => { +const EditWorkspace = ({ onClose, workspace }) => { const dispatch = useDispatch(); const inputRef = useRef(); const formik = useFormik({ - enableReinitialize: true, + enableReinitialize: true, initialValues: { name: workspace.name }, validationSchema: Yup.object({ - name: Yup.string() - .min(1, 'must be atleast 1 characters') - .max(30, 'must be 30 characters or less') - .required('name is required') + name: Yup.string().min(1, 'must be atleast 1 characters').max(30, 'must be 30 characters or less').required('name is required') }), onSubmit: (values) => { dispatch(renameWorkspace(values.name, workspace.uid)) .then(() => { - toast.success("Workspace renamed!"); + toast.success('Workspace renamed!'); onClose(); }) - .catch(() => toast.error("An error occured while renaming the workspace")); + .catch(() => toast.error('An error occured while renaming the workspace')); } }); useEffect(() => { - if(inputRef && inputRef.current) { + if (inputRef && inputRef.current) { inputRef.current.focus(); } }, [inputRef]); const onSubmit = () => { formik.handleSubmit(); - } + }; return ( - +
        - + - {formik.touched.name && formik.errors.name ? ( -
        {formik.errors.name}
        - ) : null} + {formik.touched.name && formik.errors.name ?
        {formik.errors.name}
        : null}
        -         +         ); -} +}; export default EditWorkspace; - diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/WorkspaceItem/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/WorkspaceItem/index.js index 4c8eeeb9e..25728bd71 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/WorkspaceItem/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/WorkspaceItem/index.js @@ -1,27 +1,26 @@ -import React, { useState } from "react"; -import EditWorkspace from "../EditWorkspace"; -import DeleteWorkspace from "../DeleteWorkspace"; -import { IconEdit, IconTrash } from "@tabler/icons"; -import StyledWrapper from "./StyledWrapper"; +import React, { useState } from 'react'; +import EditWorkspace from '../EditWorkspace'; +import DeleteWorkspace from '../DeleteWorkspace'; +import { IconEdit, IconTrash } from '@tabler/icons'; +import StyledWrapper from './StyledWrapper'; -const WorkspaceItem = ({workspace}) => { +const WorkspaceItem = ({ workspace }) => { const [openEditModal, setOpenEditModal] = useState(false); const [openDeleteModal, setOpenDeleteModal] = useState(false); return ( -
        +
      • {workspace.name}
        • -
        - setOpenEditModal(true)}/> - setOpenDeleteModal(true)}/> +
        + setOpenEditModal(true)} /> + setOpenDeleteModal(true)} />
        - {openEditModal && setOpenEditModal(false)} workspace={workspace} />} - {openDeleteModal && setOpenDeleteModal(false)} workspace={workspace} />} + {openEditModal && setOpenEditModal(false)} workspace={workspace} />} + {openDeleteModal && setOpenDeleteModal(false)} workspace={workspace} />}
        - ) - -} + ); +}; export default WorkspaceItem; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/index.js index 185aba2fa..17452d08c 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceConfigurer/index.js @@ -1,30 +1,19 @@ -import Modal from "components/Modal/index"; -import React, { useState } from "react"; -import { useSelector } from "react-redux"; -import WorkspaceItem from "./WorkspaceItem/index"; -import AddWorkspace from "./AddWorkspace"; +import Modal from 'components/Modal/index'; +import React, { useState } from 'react'; +import { useSelector } from 'react-redux'; +import WorkspaceItem from './WorkspaceItem/index'; +import AddWorkspace from './AddWorkspace'; -const WorkspaceConfigurer = ({onClose}) => { +const WorkspaceConfigurer = ({ onClose }) => { const { workspaces } = useSelector((state) => state.workspaces); const [openAddModal, setOpenAddModal] = useState(false); return ( - setOpenAddModal(true)} - handleCancel={onClose} - hideCancel={true} - > -
          - {workspaces && workspaces.length && workspaces.map((workspace) => ( - - ))} -
        - {openAddModal && setOpenAddModal(false)}/>} + setOpenAddModal(true)} handleCancel={onClose} hideCancel={true}> +
          {workspaces && workspaces.length && workspaces.map((workspace) => )}
        + {openAddModal && setOpenAddModal(false)} />}         ); -} +}; export default WorkspaceConfigurer; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/StyledWrapper.js b/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/StyledWrapper.js index 0f282f392..b776b1ee8 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/StyledWrapper.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/StyledWrapper.js @@ -15,4 +15,4 @@ const StyledWrapper = styled.div` } `; -export default StyledWrapper; \ No newline at end of file +export default StyledWrapper; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/index.js index 6fc598533..42e427c35 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceSelectModal/index.js @@ -1,32 +1,29 @@ -import React from "react"; -import Modal from "components/Modal/index"; +import React from 'react'; +import Modal from 'components/Modal/index'; import { IconBox } from '@tabler/icons'; -import { useSelector } from "react-redux"; +import { useSelector } from 'react-redux'; import StyledWrapper from './StyledWrapper'; -const WorkspaceSelectModal = ({onClose, onSelect, title}) => { +const WorkspaceSelectModal = ({ onClose, onSelect, title }) => { const { workspaces } = useSelector((state) => state.workspaces); return ( - -
          - {(workspaces && workspaces.length) ? workspaces.map((w) => ( -
          onSelect(w.uid)}> - {w.name} -
          - )) : ( + +
            + {workspaces && workspaces.length ? ( + workspaces.map((w) => ( +
            onSelect(w.uid)}> + {w.name} +
            + )) + ) : (
            No workspaces found
            )}
          ); -} +}; export default WorkspaceSelectModal; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/StyledWrapper.js b/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/StyledWrapper.js index c2d9a1ff9..aca131828 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/StyledWrapper.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/StyledWrapper.js @@ -2,7 +2,7 @@ import styled from 'styled-components'; const Wrapper = styled.div` .current-workspace { - margin-inline: .5rem; + margin-inline: 0.5rem; background: #e1e1e1; border-radius: 5px; diff --git a/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/index.js b/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/index.js index fba4e1114..12c5a7a6c 100644 --- a/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/index.js +++ b/packages/bruno-app/src/components/Workspaces/WorkspaceSelector/index.js @@ -1,8 +1,8 @@ import React, { useRef, forwardRef, useState, useEffect } from 'react'; import Dropdown from 'components/Dropdown'; import { IconCaretDown, IconBox, IconSwitch3, IconSettings } from '@tabler/icons'; -import WorkspaceConfigurer from "../WorkspaceConfigurer"; -import WorkspaceSelectModal from "../WorkspaceSelectModal"; +import WorkspaceConfigurer from '../WorkspaceConfigurer'; +import WorkspaceSelectModal from '../WorkspaceSelectModal'; import { useDispatch, useSelector } from 'react-redux'; import { selectWorkspace } from 'providers/ReduxStore/slices/workspaces'; import StyledWrapper from './StyledWrapper'; @@ -23,43 +23,41 @@ const WorkspaceSelector = () => { const Icon = forwardRef((props, ref) => { return (
          -
          - - - - - {activeWorkspace ? activeWorkspace.name : ''} +
          + + + {activeWorkspace ? activeWorkspace.name : ''}
          - +
          ); }); - const onDropdownCreate = (ref) => dropdownTippyRef.current = ref; + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const handleSelectWorkspace = (workspaceUid) => { - dispatch(selectWorkspace({workspaceUid: workspaceUid})); + dispatch(selectWorkspace({ workspaceUid: workspaceUid })); setOpenSwitchWorkspaceModal(false); }; return ( - {openWorkspacesModal && setOpenWorkspacesModal(false)}/>} - {openSwitchWorkspaceModal && setOpenSwitchWorkspaceModal(false)}/>} + {openWorkspacesModal && setOpenWorkspacesModal(false)} />} + {openSwitchWorkspaceModal && setOpenSwitchWorkspaceModal(false)} />}
          - } placement='bottom-end'> + } placement="bottom-end">
          setOpenSwitchWorkspaceModal(true)}>
          - +
          Switch Workspace
          setOpenWorkspacesModal(true)}>
          - +
          Configure Workspaces
          diff --git a/packages/bruno-app/src/globalStyles.js b/packages/bruno-app/src/globalStyles.js index cd18287c6..f94482dd6 100644 --- a/packages/bruno-app/src/globalStyles.js +++ b/packages/bruno-app/src/globalStyles.js @@ -71,5 +71,5 @@ const GlobalStyle = createGlobalStyle` } } `; - -export default GlobalStyle; \ No newline at end of file + +export default GlobalStyle; diff --git a/packages/bruno-app/src/hooks/useGraphqlSchema/index.js b/packages/bruno-app/src/hooks/useGraphqlSchema/index.js index 43d3ee4d9..783faa68e 100644 --- a/packages/bruno-app/src/hooks/useGraphqlSchema/index.js +++ b/packages/bruno-app/src/hooks/useGraphqlSchema/index.js @@ -1,7 +1,7 @@ import { useState, useEffect } from 'react'; import { getIntrospectionQuery, buildClientSchema } from 'graphql'; -const useGraphqlSchema =(endpoint) => { +const useGraphqlSchema = (endpoint) => { const [isLoaded, setIsLoaded] = useState(false); const [schema, setSchema] = useState(null); const [error, setError] = useState(null); @@ -9,20 +9,20 @@ const useGraphqlSchema =(endpoint) => { const introspectionQuery = getIntrospectionQuery(); const queryParams = { query: introspectionQuery - } + }; useEffect(() => { fetch(endpoint, { - method: "POST", - headers: { - 'Accept': 'application/json', - 'Content-Type': 'application/json' - }, - body: JSON.stringify(queryParams) - }) + method: 'POST', + headers: { + Accept: 'application/json', + 'Content-Type': 'application/json' + }, + body: JSON.stringify(queryParams) + }) .then((res) => res.json()) .then((s) => { - if(s && s.data) { + if (s && s.data) { setSchema(buildClientSchema(s.data)); setIsLoaded(true); } else { @@ -39,6 +39,6 @@ const useGraphqlSchema =(endpoint) => { schema, error }; -} +}; -export default useGraphqlSchema; \ No newline at end of file +export default useGraphqlSchema; diff --git a/packages/bruno-app/src/pageComponents/Collections/CollectionItem/index.js b/packages/bruno-app/src/pageComponents/Collections/CollectionItem/index.js index e0b10affc..f6b54b206 100644 --- a/packages/bruno-app/src/pageComponents/Collections/CollectionItem/index.js +++ b/packages/bruno-app/src/pageComponents/Collections/CollectionItem/index.js @@ -1,23 +1,25 @@ import React, { useState } from 'react'; -import { IconEdit, IconTrash } from "@tabler/icons"; +import { IconEdit, IconTrash } from '@tabler/icons'; import RenameCollection from 'components/Sidebar/Collections/Collection/RenameCollection'; import DeleteCollection from 'components/Sidebar/Collections/Collection/DeleteCollection'; -export default function CollectionItem({collection}) { +export default function CollectionItem({ collection }) { const [showRenameCollectionModal, setShowRenameCollectionModal] = useState(false); const [showDeleteCollectionModal, setShowDeleteCollectionModal] = useState(false); return ( <> - {showRenameCollectionModal && setShowRenameCollectionModal(false)}/>} - {showDeleteCollectionModal && setShowDeleteCollectionModal(false)}/>} + {showRenameCollectionModal && setShowRenameCollectionModal(false)} />} + {showDeleteCollectionModal && setShowDeleteCollectionModal(false)} />}
          -
        • {collection.name}
          • -
          - setShowRenameCollectionModal(true)}/> - setShowDeleteCollectionModal(true)}/> +
        • + {collection.name} +
          • +
          + setShowRenameCollectionModal(true)} /> + setShowDeleteCollectionModal(true)} />
          -
          +
          ); -}; +} diff --git a/packages/bruno-app/src/pageComponents/Collections/index.js b/packages/bruno-app/src/pageComponents/Collections/index.js index 0dd9b3222..68463c5ee 100644 --- a/packages/bruno-app/src/pageComponents/Collections/index.js +++ b/packages/bruno-app/src/pageComponents/Collections/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import filter from "lodash/filter"; +import filter from 'lodash/filter'; import { useSelector } from 'react-redux'; import CollectionItem from './CollectionItem'; import StyledWrapper from './StyledWrapper'; @@ -14,13 +14,14 @@ export default function Collections() {

          Collections

          - {(collectionsToDisplay && collectionsToDisplay.length) ? collectionsToDisplay.map((collection) => { - return ; - }): ( + {collectionsToDisplay && collectionsToDisplay.length ? ( + collectionsToDisplay.map((collection) => { + return ; + }) + ) : (
          No collections found
          )}
          ); -}; - +} diff --git a/packages/bruno-app/src/pageComponents/Index/StyledWrapper.js b/packages/bruno-app/src/pageComponents/Index/StyledWrapper.js index ca6b1011c..92dad2c14 100644 --- a/packages/bruno-app/src/pageComponents/Index/StyledWrapper.js +++ b/packages/bruno-app/src/pageComponents/Index/StyledWrapper.js @@ -13,7 +13,8 @@ const Wrapper = styled.div` section.main { display: flex; - section.request-pane, section.response-pane { + section.request-pane, + section.response-pane { } } diff --git a/packages/bruno-app/src/pageComponents/Index/index.js b/packages/bruno-app/src/pageComponents/Index/index.js index b792d5b02..1dbe8719c 100644 --- a/packages/bruno-app/src/pageComponents/Index/index.js +++ b/packages/bruno-app/src/pageComponents/Index/index.js @@ -8,7 +8,7 @@ import { useSelector } from 'react-redux'; import StyledWrapper from './StyledWrapper'; const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true; -if(!SERVER_RENDERED) { +if (!SERVER_RENDERED) { require('codemirror/mode/javascript/javascript'); require('codemirror/mode/xml/xml'); require('codemirror/addon/edit/matchbrackets'); @@ -47,18 +47,17 @@ export default function Main() {
          -
          +
          {showHomePage ? ( - ): ( + ) : ( <> - + )}
          ); -}; - +} diff --git a/packages/bruno-app/src/pageComponents/Login/StyledWrapper.js b/packages/bruno-app/src/pageComponents/Login/StyledWrapper.js index 05ca16a88..140164014 100644 --- a/packages/bruno-app/src/pageComponents/Login/StyledWrapper.js +++ b/packages/bruno-app/src/pageComponents/Login/StyledWrapper.js @@ -22,7 +22,7 @@ const Wrapper = styled.div` background: #e2e6ea; border: solid 1px #dae0e5; } - + .field-error { font-size: 0.875rem; } diff --git a/packages/bruno-app/src/pageComponents/Login/index.js b/packages/bruno-app/src/pageComponents/Login/index.js index 1f45c1ea9..793a12e4a 100644 --- a/packages/bruno-app/src/pageComponents/Login/index.js +++ b/packages/bruno-app/src/pageComponents/Login/index.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState } from 'react'; import * as Yup from 'yup'; import Link from 'next/link'; import { useRouter } from 'next/router'; @@ -11,31 +11,26 @@ const Login = () => { const router = useRouter(); const [authState, authDispatch] = useAuth(); - const { - currentUser - } = authState; + const { currentUser } = authState; const [loggingIn, setLoggingIn] = useState(false); const [loginError, setLoginError] = useState(false); const formik = useFormik({ - initialValues: { - email: '', - password: '', - }, - validationSchema: Yup.object({ - email: Yup.string() - .required('Email is required'), - password: Yup.string() - .required('Password is required') - }), - onSubmit: (values, { resetForm }) => { + initialValues: { + email: '', + password: '' + }, + validationSchema: Yup.object({ + email: Yup.string().required('Email is required'), + password: Yup.string().required('Password is required') + }), + onSubmit: (values, { resetForm }) => { setLoggingIn(true); - AuthApi - .login({ - email: values.email, - password: values.password - }) + AuthApi.login({ + email: values.email, + password: values.password + }) .then((response) => { authDispatch({ type: 'LOGIN_SUCCESS', @@ -46,46 +41,131 @@ const Login = () => { setLoggingIn(false); setLoginError(true); }); - }, + } }); - if(authState.isLoading) { + if (authState.isLoading) { return null; - }; + } - if(currentUser) { + if (currentUser) { router.push('/'); return null; - }; + } return (
          -
          +
          - - - + + + - - - + + + - - - - - - - - - - + + + + + + + + + +
          -
          bruno
          +
          + bruno +
          Opensource API Collection Collaboration Platform
          @@ -93,8 +173,13 @@ const Login = () => {
          Login
          - - + Email + + { onBlur={formik.handleBlur} value={formik.values.email} /> - {formik.touched.email && formik.errors.email ? ( -
          {formik.errors.email}
          - ) : null} + {formik.touched.email && formik.errors.email ?
          {formik.errors.email}
          : null}
          - - + Password + + { onBlur={formik.handleBlur} value={formik.values.password} /> - {formik.touched.password && formik.errors.password ? ( -
          {formik.errors.password}
          - ) : null} + {formik.touched.password && formik.errors.password ?
          {formik.errors.password}
          : null}
          - { loggingIn ? ( - - ) : -
          -
          - } - {loginError ? ( -
          Invalid Credentials
          - ) : null} + )} + {loginError ?
          Invalid Credentials
          : null}
          -
          -
          +
          No account? Create one!
          - ) + ); }; export default Login; diff --git a/packages/bruno-app/src/pageComponents/SignUp/StyledWrapper.js b/packages/bruno-app/src/pageComponents/SignUp/StyledWrapper.js index 85d4b5a85..74ee1de94 100644 --- a/packages/bruno-app/src/pageComponents/SignUp/StyledWrapper.js +++ b/packages/bruno-app/src/pageComponents/SignUp/StyledWrapper.js @@ -22,7 +22,7 @@ const Wrapper = styled.div` background: #e2e6ea; border: solid 1px #dae0e5; } - + .field-error { font-size: 0.875rem; } diff --git a/packages/bruno-app/src/pageComponents/SignUp/index.js b/packages/bruno-app/src/pageComponents/SignUp/index.js index 709398def..b993b8c01 100644 --- a/packages/bruno-app/src/pageComponents/SignUp/index.js +++ b/packages/bruno-app/src/pageComponents/SignUp/index.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState } from 'react'; import Link from 'next/link'; import StyledWrapper from './StyledWrapper'; import AuthApi from 'api/auth'; @@ -14,9 +14,7 @@ const SignUp = () => { const [errorMsg, setErrorMsg] = useState(''); const [signingUp, setSigningUp] = useState(false); - const { - currentUser - } = authState; + const { currentUser } = authState; const formik = useFormik({ initialValues: { @@ -25,26 +23,17 @@ const SignUp = () => { password: '' }, validationSchema: Yup.object({ - name: Yup.string() - .min(3, 'Must be atleast 3 characters') - .max(50, 'Must be 50 characters or less') - .required('Required'), - email: Yup.string() - .email('Invalid email address') - .required('Required'), - password: Yup.string() - .min(8, 'Must be atleast 8 characters') - .max(50, 'Must be 50 characters or less') - .required('Required') + name: Yup.string().min(3, 'Must be atleast 3 characters').max(50, 'Must be 50 characters or less').required('Required'), + email: Yup.string().email('Invalid email address').required('Required'), + password: Yup.string().min(8, 'Must be atleast 8 characters').max(50, 'Must be 50 characters or less').required('Required') }), onSubmit: (values, { resetForm }) => { setSigningUp(true); - AuthApi - .signup({ - name: values.name, - email: values.email, - password: values.password - }) + AuthApi.signup({ + name: values.name, + email: values.email, + password: values.password + }) .then((response) => { authDispatch({ type: 'LOGIN_SUCCESS', @@ -54,49 +43,134 @@ const SignUp = () => { .catch((error) => { setSigningUp(false); setErrorSigningUp(true); - setErrorMsg(error.message || 'An error occured during signup') + setErrorMsg(error.message || 'An error occured during signup'); }); setSigningUp(false); - }, + } }); - if(authState.isLoading) { + if (authState.isLoading) { return null; - }; + } - if(currentUser) { + if (currentUser) { router.push('/'); return null; - }; + } return (
          -
          +
          - - - + + + - - - + + + - - - - - - - - - - + + + + + + + + + +
          -
          bruno
          +
          + bruno +
          Opensource API Collection Collaboration Platform
          @@ -105,83 +179,95 @@ const SignUp = () => {
          Create Account
          - - + Name + + setErrorSigningUp(false)} + onFocus={() => setErrorSigningUp(false)} /> - {formik.touched.name && formik.errors.name ? ( -
          {formik.errors.name}
          - ) : null} + {formik.touched.name && formik.errors.name ?
          {formik.errors.name}
          : null}
          - - + Email address + + setErrorSigningUp(false)} + onFocus={() => setErrorSigningUp(false)} /> - {formik.touched.email && formik.errors.email ? ( -
          {formik.errors.email}
          - ) : null} + {formik.touched.email && formik.errors.email ?
          {formik.errors.email}
          : null}
          - - + Password + + setErrorSigningUp(false)} + onFocus={() => setErrorSigningUp(false)} /> - {formik.touched.password && formik.errors.password ? ( -
          {formik.errors.password}
          - ) : null} + {formik.touched.password && formik.errors.password ?
          {formik.errors.password}
          : null}
          -
          - By signing in you are agreeing to our Terms of Use and our Privacy Policy. -
          +
          By signing in you are agreeing to our Terms of Use and our Privacy Policy.
          - { signingUp ? ( + {signingUp ? (
          -
          - ) : + ) : (
          - {errorSigningUp ? ( -
          {errorMsg}
          - ) : null} + {errorSigningUp ?
          {errorMsg}
          : null}
          -
          - } -
          -
          + )}
          +
          Already have an account? Log in
          - ) + ); }; export default SignUp; diff --git a/packages/bruno-app/src/pages/_app.js b/packages/bruno-app/src/pages/_app.js index 11ef19ff8..1fd6ab647 100644 --- a/packages/bruno-app/src/pages/_app.js +++ b/packages/bruno-app/src/pages/_app.js @@ -5,7 +5,7 @@ import ReduxStore from 'providers/ReduxStore'; import { Provider } from 'react-redux'; import { Toaster } from 'react-hot-toast'; -import '../styles/globals.css' +import '../styles/globals.css'; import 'tailwindcss/dist/tailwind.min.css'; import 'react-tabs/style/react-tabs.css'; import 'codemirror/lib/codemirror.css'; @@ -14,25 +14,17 @@ import 'graphiql/graphiql.min.css'; import '../styles/app.scss'; function SafeHydrate({ children }) { - return ( -
          - {typeof window === 'undefined' ? null : children} -
          - ) + return
          {typeof window === 'undefined' ? null : children}
          ; } function NoSsr({ children }) { const SERVER_RENDERED = typeof navigator === 'undefined'; - if(SERVER_RENDERED) { + if (SERVER_RENDERED) { return null; } - return ( - <> - {children} - - ) + return <>{children}; } function MyApp({ Component, pageProps }) { @@ -42,7 +34,7 @@ function MyApp({ Component, pageProps }) { - + @@ -52,4 +44,4 @@ function MyApp({ Component, pageProps }) { ); } -export default MyApp +export default MyApp; diff --git a/packages/bruno-app/src/pages/_document.js b/packages/bruno-app/src/pages/_document.js index 444a83b2b..75877eb51 100644 --- a/packages/bruno-app/src/pages/_document.js +++ b/packages/bruno-app/src/pages/_document.js @@ -9,11 +9,10 @@ export default class MyDocument extends Document { try { ctx.renderPage = () => originalRenderPage({ - enhanceApp: (App) => (props) => - sheet.collectStyles(), - }) + enhanceApp: (App) => (props) => sheet.collectStyles() + }); - const initialProps = await Document.getInitialProps(ctx) + const initialProps = await Document.getInitialProps(ctx); return { ...initialProps, styles: ( @@ -21,7 +20,7 @@ export default class MyDocument extends Document { {initialProps.styles} {sheet.getStyleElement()} - ), + ) }; } finally { sheet.seal(); @@ -32,7 +31,7 @@ export default class MyDocument extends Document { return ( - +
          diff --git a/packages/bruno-app/src/pages/collections.js b/packages/bruno-app/src/pages/collections.js index 7213753e8..74f9f767a 100644 --- a/packages/bruno-app/src/pages/collections.js +++ b/packages/bruno-app/src/pages/collections.js @@ -23,4 +23,4 @@ export default function CollectionsPage() {
          ); -}; +} diff --git a/packages/bruno-app/src/pages/index.js b/packages/bruno-app/src/pages/index.js index 2be2f8f11..8c1a8ae5e 100644 --- a/packages/bruno-app/src/pages/index.js +++ b/packages/bruno-app/src/pages/index.js @@ -17,4 +17,4 @@ export default function Home() {
          ); -}; +} diff --git a/packages/bruno-app/src/pages/login.js b/packages/bruno-app/src/pages/login.js index 0182a6108..471aab7de 100644 --- a/packages/bruno-app/src/pages/login.js +++ b/packages/bruno-app/src/pages/login.js @@ -23,4 +23,4 @@ export default function LoginPage() {
        ); -}; +} diff --git a/packages/bruno-app/src/pages/signup.js b/packages/bruno-app/src/pages/signup.js index aceba8f7f..9a81aa55b 100644 --- a/packages/bruno-app/src/pages/signup.js +++ b/packages/bruno-app/src/pages/signup.js @@ -23,4 +23,4 @@ export default function SignUpPage() {
        ); -}; +} diff --git a/packages/bruno-app/src/providers/App/index.js b/packages/bruno-app/src/providers/App/index.js index 4f45dd8d0..436f44298 100644 --- a/packages/bruno-app/src/providers/App/index.js +++ b/packages/bruno-app/src/providers/App/index.js @@ -6,7 +6,7 @@ import { refreshScreenWidth } from 'providers/ReduxStore/slices/app'; export const AppContext = React.createContext(); -export const AppProvider = props => { +export const AppProvider = (props) => { useIdb(); useLocalCollectionTreeSync(); @@ -27,7 +27,7 @@ export const AppProvider = props => { }, []); return ( - + {props.children} ); diff --git a/packages/bruno-app/src/providers/App/useIdb.js b/packages/bruno-app/src/providers/App/useIdb.js index 98545d395..42ead12e2 100644 --- a/packages/bruno-app/src/providers/App/useIdb.js +++ b/packages/bruno-app/src/providers/App/useIdb.js @@ -1,8 +1,8 @@ import { useEffect } from 'react'; import { openDB } from 'idb'; -import { idbConnectionReady } from 'providers/ReduxStore/slices/app' -import { loadCollectionsFromIdb } from 'providers/ReduxStore/slices/collections/actions' -import { loadWorkspacesFromIdb } from 'providers/ReduxStore/slices/workspaces/actions' +import { idbConnectionReady } from 'providers/ReduxStore/slices/app'; +import { loadCollectionsFromIdb } from 'providers/ReduxStore/slices/collections/actions'; +import { loadWorkspacesFromIdb } from 'providers/ReduxStore/slices/workspaces/actions'; import { useDispatch } from 'react-redux'; const useIdb = () => { @@ -12,7 +12,7 @@ const useIdb = () => { let dbName = `bruno`; let connection = openDB(dbName, 1, { upgrade(db, oldVersion, newVersion, transaction) { - switch(oldVersion) { + switch (oldVersion) { case 0: const collectionStore = db.createObjectStore('collection', { keyPath: 'uid' }); const workspaceStore = db.createObjectStore('workspace', { keyPath: 'uid' }); @@ -31,4 +31,4 @@ const useIdb = () => { }, []); }; -export default useIdb; \ No newline at end of file +export default useIdb; diff --git a/packages/bruno-app/src/providers/App/useLocalCollectionTreeSync.js b/packages/bruno-app/src/providers/App/useLocalCollectionTreeSync.js index 10f123af1..86407b3b7 100644 --- a/packages/bruno-app/src/providers/App/useLocalCollectionTreeSync.js +++ b/packages/bruno-app/src/providers/App/useLocalCollectionTreeSync.js @@ -8,17 +8,14 @@ import { localCollectionUnlinkDirectoryEvent } from 'providers/ReduxStore/slices/collections'; import toast from 'react-hot-toast'; -import { - openLocalCollectionEvent, - localCollectionLoadEnvironmentsEvent -} from 'providers/ReduxStore/slices/collections/actions'; +import { openLocalCollectionEvent, localCollectionLoadEnvironmentsEvent } from 'providers/ReduxStore/slices/collections/actions'; import { isElectron } from 'utils/common/platform'; const useLocalCollectionTreeSync = () => { const dispatch = useDispatch(); useEffect(() => { - if(!isElectron()) { + if (!isElectron()) { return () => {}; } @@ -30,37 +27,47 @@ const useLocalCollectionTreeSync = () => { }; const _collectionTreeUpdated = (type, val) => { - if(type === 'addDir') { - dispatch(localCollectionAddDirectoryEvent({ - dir: val - })); + if (type === 'addDir') { + dispatch( + localCollectionAddDirectoryEvent({ + dir: val + }) + ); } - if(type === 'addFile') { - dispatch(localCollectionAddFileEvent({ - file: val - })); - } - if(type === 'change') { - dispatch(localCollectionChangeFileEvent({ - file: val - })); - } - if(type === 'unlink') { - setTimeout(() => { - dispatch(localCollectionUnlinkFileEvent({ + if (type === 'addFile') { + dispatch( + localCollectionAddFileEvent({ file: val - })); + }) + ); + } + if (type === 'change') { + dispatch( + localCollectionChangeFileEvent({ + file: val + }) + ); + } + if (type === 'unlink') { + setTimeout(() => { + dispatch( + localCollectionUnlinkFileEvent({ + file: val + }) + ); }, 100); } - if(type === 'unlinkDir') { - dispatch(localCollectionUnlinkDirectoryEvent({ - directory: val - })); + if (type === 'unlinkDir') { + dispatch( + localCollectionUnlinkDirectoryEvent({ + directory: val + }) + ); } - if(type === 'addEnvironmentFile') { + if (type === 'addEnvironmentFile') { dispatch(localCollectionLoadEnvironmentsEvent(val)); } - if(type === 'changeEnvironmentFile') { + if (type === 'changeEnvironmentFile') { dispatch(localCollectionLoadEnvironmentsEvent(val)); } }; @@ -89,4 +96,4 @@ const useLocalCollectionTreeSync = () => { }, [isElectron]); }; -export default useLocalCollectionTreeSync; \ No newline at end of file +export default useLocalCollectionTreeSync; diff --git a/packages/bruno-app/src/providers/Auth/index.js b/packages/bruno-app/src/providers/Auth/index.js index b0c5a77b5..ab5fd0a7c 100644 --- a/packages/bruno-app/src/providers/Auth/index.js +++ b/packages/bruno-app/src/providers/Auth/index.js @@ -11,18 +11,17 @@ const initialState = { currentUser: null }; -export const AuthProvider = props => { +export const AuthProvider = (props) => { const router = useRouter(); const [state, dispatch] = useReducer(reducer, initialState); - + useEffect(() => { - AuthApi - .whoami() + AuthApi.whoami() .then((response) => { let data = response.data; dispatch({ type: 'WHOAMI_SUCCESS', - user : { + user: { id: data.id, name: data.name, username: data.username @@ -38,10 +37,10 @@ export const AuthProvider = props => { }, []); useEffect(() => { - if(state.lastStateTransition === 'LOGIN_SUCCESS') { + if (state.lastStateTransition === 'LOGIN_SUCCESS') { router.push('/'); } - if(state.lastStateTransition === 'WHOAMI_ERROR') { + if (state.lastStateTransition === 'WHOAMI_ERROR') { // Todo: decide action // router.push('/login'); } diff --git a/packages/bruno-app/src/providers/Auth/reducer.js b/packages/bruno-app/src/providers/Auth/reducer.js index 80dba541c..2b774b32c 100644 --- a/packages/bruno-app/src/providers/Auth/reducer.js +++ b/packages/bruno-app/src/providers/Auth/reducer.js @@ -40,4 +40,4 @@ const reducer = (state, action) => { } }; -export default reducer; \ No newline at end of file +export default reducer; diff --git a/packages/bruno-app/src/providers/Hotkeys/index.js b/packages/bruno-app/src/providers/Hotkeys/index.js index faf071ddc..553477609 100644 --- a/packages/bruno-app/src/providers/Hotkeys/index.js +++ b/packages/bruno-app/src/providers/Hotkeys/index.js @@ -4,16 +4,16 @@ import find from 'lodash/find'; import Mousetrap from 'mousetrap'; import { useSelector, useDispatch } from 'react-redux'; import SaveRequest from 'components/RequestPane/SaveRequest'; -import EnvironmentSettings from "components/Environments/EnvironmentSettings"; -import NetworkError from "components/ResponsePane/NetworkError"; -import NewRequest from "components/Sidebar/NewRequest"; +import EnvironmentSettings from 'components/Environments/EnvironmentSettings'; +import NetworkError from 'components/ResponsePane/NetworkError'; +import NewRequest from 'components/Sidebar/NewRequest'; import BrunoSupport from 'components/BrunoSupport'; import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions'; import { findCollectionByUid, findItemInCollection } from 'utils/collections'; export const HotkeysContext = React.createContext(); -export const HotkeysProvider = props => { +export const HotkeysProvider = (props) => { const dispatch = useDispatch(); const tabs = useSelector((state) => state.tabs.tabs); const collections = useSelector((state) => state.collections.collections); @@ -22,35 +22,35 @@ export const HotkeysProvider = props => { const [showEnvSettingsModal, setShowEnvSettingsModal] = useState(false); const [showNewRequestModal, setShowNewRequestModal] = useState(false); const [showBrunoSupportModal, setShowBrunoSupportModal] = useState(false); - + const getCurrentCollectionItems = () => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); return collection ? collection.items : []; - }; + } }; const getCurrentCollection = () => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); return collection; - }; + } }; // save hotkey useEffect(() => { Mousetrap.bind(['command+s', 'ctrl+s'], (e) => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, activeTab.uid); - if(item && item.uid) { - dispatch(saveRequest(activeTab.uid, activeTab.collectionUid)) + if (item && item.uid) { + dispatch(saveRequest(activeTab.uid, activeTab.collectionUid)); } else { setShowSaveRequestModal(true); } @@ -69,16 +69,17 @@ export const HotkeysProvider = props => { useEffect(() => { Mousetrap.bind(['command+enter', 'ctrl+enter'], (e) => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, activeTab.uid); - if(item) { - dispatch(sendRequest(item, collection.uid)) - .catch((err) => toast.custom((t) => ( toast.dismiss(t.id)}/>), { + if (item) { + dispatch(sendRequest(item, collection.uid)).catch((err) => + toast.custom((t) => toast.dismiss(t.id)} />, { duration: 5000 - })); + }) + ); } } } @@ -95,10 +96,10 @@ export const HotkeysProvider = props => { useEffect(() => { Mousetrap.bind(['command+e', 'ctrl+e'], (e) => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); - if(collection) { + if (collection) { setShowEnvSettingsModal(true); } } @@ -115,10 +116,10 @@ export const HotkeysProvider = props => { useEffect(() => { Mousetrap.bind(['command+b', 'ctrl+b'], (e) => { const activeTab = find(tabs, (t) => t.uid === activeTabUid); - if(activeTab) { + if (activeTab) { const collection = findCollectionByUid(collections, activeTab.collectionUid); - if(collection) { + if (collection) { setShowNewRequestModal(true); } } @@ -144,19 +145,17 @@ export const HotkeysProvider = props => { }, [setShowNewRequestModal]); return ( - - {showBrunoSupportModal && setShowBrunoSupportModal(false)}/>} - {showSaveRequestModal && setShowSaveRequestModal(false)}/>} - {showEnvSettingsModal && setShowEnvSettingsModal(false)}/>} - {showNewRequestModal && setShowNewRequestModal(false)}/>} -
        - {props.children} -
        + + {showBrunoSupportModal && setShowBrunoSupportModal(false)} />} + {showSaveRequestModal && setShowSaveRequestModal(false)} />} + {showEnvSettingsModal && setShowEnvSettingsModal(false)} />} + {showNewRequestModal && setShowNewRequestModal(false)} />} +
        {props.children}
         ); }; -export const useHotkeys = () => { +export const useHotkeys = () => { const context = React.useContext(HotkeysContext); if (!context) { @@ -164,6 +163,6 @@ export const useHotkeys = () => { } return context; -} +}; export default HotkeysProvider; diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/app.js b/packages/bruno-app/src/providers/ReduxStore/slices/app.js index 70eca7dab..8c3c08f97 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/app.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/app.js @@ -1,4 +1,4 @@ -import { createSlice } from '@reduxjs/toolkit' +import { createSlice } from '@reduxjs/toolkit'; const initialState = { isDragging: false, @@ -38,14 +38,6 @@ export const appSlice = createSlice({ } }); -export const { - idbConnectionReady, - toggleLeftMenuBar, - refreshScreenWidth, - updateLeftSidebarWidth, - updateIsDragging, - showHomePage, - hideHomePage -} = appSlice.actions; +export const { idbConnectionReady, toggleLeftMenuBar, refreshScreenWidth, updateLeftSidebarWidth, updateIsDragging, showHomePage, hideHomePage } = appSlice.actions; export default appSlice.reducer; diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js index 9dc71dc0f..190e1e7c7 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js @@ -52,15 +52,19 @@ const PATH_SEPARATOR = path.sep; export const loadCollectionsFromIdb = () => (dispatch) => { getCollectionsFromIdb(window.__idb) - .then((collections) => dispatch(loadCollections({ - collections: collections - }))) - .catch(() => toast.error("Error occured while loading collections from IndexedDB")); + .then((collections) => + dispatch( + loadCollections({ + collections: collections + }) + ) + ) + .catch(() => toast.error('Error occured while loading collections from IndexedDB')); }; export const createCollection = (collectionName) => (dispatch, getState) => { const newCollection = { - version: "1", + version: '1', uid: uuid(), name: collectionName, items: [], @@ -87,7 +91,7 @@ export const createCollection = (collectionName) => (dispatch, getState) => { } }; - newCollection.items.push(requestItem) + newCollection.items.push(requestItem); const state = getState(); const { activeWorkspaceUid } = state.workspaces; @@ -100,10 +104,14 @@ export const createCollection = (collectionName) => (dispatch, getState) => { .then(waitForNextTick) .then(() => dispatch(addCollectionToWorkspace(activeWorkspaceUid, newCollection.uid))) .then(waitForNextTick) - .then(() => dispatch(addTab({ - uid: requestItem.uid, - collectionUid: newCollection.uid - }))) + .then(() => + dispatch( + addTab({ + uid: requestItem.uid, + collectionUid: newCollection.uid + }) + ) + ) .then(resolve) .catch(reject); }); @@ -113,7 +121,7 @@ export const renameCollection = (newName, collectionUid) => (dispatch, getState) const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(collection) { + if (collection) { const collectionCopy = cloneDeep(collection); collectionCopy.name = newName; const collectionToSave = transformCollectionToSaveToIdb(collectionCopy, { @@ -124,10 +132,12 @@ export const renameCollection = (newName, collectionUid) => (dispatch, getState) .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_renameCollection({ - newName: newName, - collectionUid: collectionUid - })); + dispatch( + _renameCollection({ + newName: newName, + collectionUid: collectionUid + }) + ); }) .catch((err) => console.log(err)); } @@ -138,18 +148,22 @@ export const deleteCollection = (collectionUid) => (dispatch, getState) => { const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject('collection not found'); } deleteCollectionInIdb(window.__idb, collection.uid) .then(() => { - dispatch(closeTabs({ - tabUids: recursivelyGetAllItemUids(collection.items) - })); - dispatch(_deleteCollection({ - collectionUid: collectionUid - })); + dispatch( + closeTabs({ + tabUids: recursivelyGetAllItemUids(collection.items) + }) + ); + dispatch( + _deleteCollection({ + collectionUid: collectionUid + }) + ); }) .then(resolve) .catch(reject); @@ -161,15 +175,15 @@ export const saveRequest = (itemUid, collectionUid) => (dispatch, getState) => { const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const item = findItemInCollection(collectionCopy, itemUid); - if(item) { + if (item) { const itemToSave = transformRequestToSaveToFilesystem(item); const { ipcRenderer } = window; @@ -179,7 +193,7 @@ export const saveRequest = (itemUid, collectionUid) => (dispatch, getState) => { .then(resolve) .catch(reject); } else { - reject(new Error("Not able to locate item")); + reject(new Error('Not able to locate item')); } return; } @@ -190,10 +204,12 @@ export const saveRequest = (itemUid, collectionUid) => (dispatch, getState) => { .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_saveRequest({ - itemUid: itemUid, - collectionUid: collectionUid - })); + dispatch( + _saveRequest({ + itemUid: itemUid, + collectionUid: collectionUid + }) + ); }) .then(() => resolve()) .catch((error) => reject(error)); @@ -206,41 +222,47 @@ export const sendRequest = (item, collectionUid) => (dispatch, getState) => { const cancelTokenUid = uuid(); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } - - dispatch(requestSent({ - itemUid: item.uid, - collectionUid: collectionUid, - cancelTokenUid: cancelTokenUid - })); - + + dispatch( + requestSent({ + itemUid: item.uid, + collectionUid: collectionUid, + cancelTokenUid: cancelTokenUid + }) + ); + const itemCopy = cloneDeep(item); const collectionCopy = cloneDeep(collection); - if(collection.activeEnvironmentUid) { + if (collection.activeEnvironmentUid) { const environment = findEnvironmentInCollection(collectionCopy, collection.activeEnvironmentUid); - if(environment) { - interpolateEnvironmentVars(itemCopy, environment.variables) - } + if (environment) { + interpolateEnvironmentVars(itemCopy, environment.variables); + } } - - sendNetworkRequest(itemCopy, {cancelTokenUid: cancelTokenUid}) + + sendNetworkRequest(itemCopy, { cancelTokenUid: cancelTokenUid }) .then((response) => { - return dispatch(responseReceived({ - itemUid: item.uid, - collectionUid: collectionUid, - response: response - })); + return dispatch( + responseReceived({ + itemUid: item.uid, + collectionUid: collectionUid, + response: response + }) + ); }) .then(resolve) .catch((err) => { - dispatch(responseReceived({ - itemUid: item.uid, - collectionUid: collectionUid, - response: null - })); + dispatch( + responseReceived({ + itemUid: item.uid, + collectionUid: collectionUid, + response: null + }) + ); console.log('>> sending request failed'); console.log(err); reject(err); @@ -251,10 +273,12 @@ export const sendRequest = (item, collectionUid) => (dispatch, getState) => { export const cancelRequest = (cancelTokenUid, item, collection) => (dispatch) => { cancelNetworkRequest(cancelTokenUid) .then(() => { - dispatch(requestCancelled({ - itemUid: item.uid, - collectionUid: collection.uid - })) + dispatch( + requestCancelled({ + itemUid: item.uid, + collectionUid: collection.uid + }) + ); }) .catch((err) => console.log(err)); }; @@ -264,41 +288,41 @@ export const newFolder = (folderName, collectionUid, itemUid) => (dispatch, getS const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } - if(isLocalCollection(collection)) { - if(!itemUid) { + if (isLocalCollection(collection)) { + if (!itemUid) { const folderWithSameNameExists = find(collection.items, (i) => i.type === 'folder' && trim(i.name) === trim(folderName)); - if(!folderWithSameNameExists) { + if (!folderWithSameNameExists) { const fullName = `${collection.pathname}${PATH_SEPARATOR}${folderName}`; const { ipcRenderer } = window; - + ipcRenderer .invoke('renderer:new-folder', fullName) .then(() => resolve()) .catch((error) => reject(error)); } else { - return reject(new Error("folder with same name already exists")); + return reject(new Error('folder with same name already exists')); } } else { const currentItem = findItemInCollection(collection, itemUid); - if(currentItem) { + if (currentItem) { const folderWithSameNameExists = find(currentItem.items, (i) => i.type === 'folder' && trim(i.name) === trim(folderName)); - if(!folderWithSameNameExists) { + if (!folderWithSameNameExists) { const fullName = `${currentItem.pathname}${PATH_SEPARATOR}${folderName}`; const { ipcRenderer } = window; - + ipcRenderer .invoke('renderer:new-folder', fullName) .then(() => resolve()) .catch((error) => reject(error)); } else { - return reject(new Error("folder with same name already exists")); + return reject(new Error('folder with same name already exists')); } } else { - return reject(new Error("unable to find parent folder")); + return reject(new Error('unable to find parent folder')); } } return; @@ -311,11 +335,11 @@ export const newFolder = (folderName, collectionUid, itemUid) => (dispatch, getS type: 'folder', items: [] }; - if(!itemUid) { + if (!itemUid) { collectionCopy.items.push(item); } else { const currentItem = findItemInCollection(collectionCopy, itemUid); - if(currentItem && currentItem.type === 'folder') { + if (currentItem && currentItem.type === 'folder') { currentItem.items = currentItem.items || []; currentItem.items.push(item); } @@ -326,11 +350,13 @@ export const newFolder = (folderName, collectionUid, itemUid) => (dispatch, getS .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_newItem({ - item: item, - currentItemUid: itemUid, - collectionUid: collectionUid - })); + dispatch( + _newItem({ + item: item, + currentItemUid: itemUid, + collectionUid: collectionUid + }) + ); }) .then(() => resolve()) .catch((error) => reject(error)); @@ -342,32 +368,29 @@ export const renameItem = (newName, itemUid, collectionUid) => (dispatch, getSta const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); const item = findItemInCollection(collectionCopy, itemUid); - if(!item) { - return reject(new Error("Unable to locate item")); + if (!item) { + return reject(new Error('Unable to locate item')); } - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const dirname = path.dirname(item.pathname); let newPathname = ''; - if(item.type === 'folder') { + if (item.type === 'folder') { newPathname = `${dirname}${PATH_SEPARATOR}${trim(newName)}`; } else { const filename = resolveRequestFilename(newName); newPathname = `${dirname}${PATH_SEPARATOR}${filename}`; } const { ipcRenderer } = window; - - ipcRenderer - .invoke('renderer:rename-item', item.pathname, newPathname, newName) - .then(resolve) - .catch(reject); + + ipcRenderer.invoke('renderer:rename-item', item.pathname, newPathname, newName).then(resolve).catch(reject); return; } @@ -381,11 +404,13 @@ export const renameItem = (newName, itemUid, collectionUid) => (dispatch, getSta .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_renameItem({ - newName: newName, - itemUid: itemUid, - collectionUid: collectionUid - })); + dispatch( + _renameItem({ + newName: newName, + itemUid: itemUid, + collectionUid: collectionUid + }) + ); }) .then(() => resolve()) .catch((error) => reject(error)); @@ -397,30 +422,30 @@ export const cloneItem = (newName, itemUid, collectionUid) => (dispatch, getStat const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { throw new Error('Collection not found'); } const collectionCopy = cloneDeep(collection); const item = findItemInCollection(collectionCopy, itemUid); - if(!item) { + if (!item) { throw new Error('Unable to locate item'); } - if(isItemAFolder(item)) { + if (isItemAFolder(item)) { throw new Error('Cloning folders is not supported yet'); } - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const parentItem = findParentItemInCollection(collectionCopy, itemUid); const filename = resolveRequestFilename(newName); const itemToSave = refreshUidsInItem(transformRequestToSaveToFilesystem(item)); itemToSave.name = trim(newName); - if(!parentItem) { + if (!parentItem) { const reqWithSameNameExists = find(collection.items, (i) => i.type !== 'folder' && trim(i.filename) === trim(filename)); - if(!reqWithSameNameExists) { + if (!reqWithSameNameExists) { const fullName = `${collection.pathname}${PATH_SEPARATOR}${filename}`; const { ipcRenderer } = window; - + itemSchema .validate(itemToSave) .then(() => ipcRenderer.invoke('renderer:new-request', fullName, itemToSave)) @@ -431,7 +456,7 @@ export const cloneItem = (newName, itemUid, collectionUid) => (dispatch, getStat } } else { const reqWithSameNameExists = find(parentItem.items, (i) => i.type !== 'folder' && trim(i.filename) === trim(filename)); - if(!reqWithSameNameExists) { + if (!reqWithSameNameExists) { const dirname = path.dirname(item.pathname); const fullName = `${dirname}${PATH_SEPARATOR}${filename}`; const { ipcRenderer } = window; @@ -446,17 +471,17 @@ export const cloneItem = (newName, itemUid, collectionUid) => (dispatch, getStat } } return; - }; + } // todo: clone query params const clonedItem = cloneDeep(item); clonedItem.name = newName; clonedItem.uid = uuid(); - each(clonedItem.headers, h => h.uid = uuid()); + each(clonedItem.headers, (h) => (h.uid = uuid())); const parentItem = findParentItemInCollection(collectionCopy, itemUid); - if(!parentItem) { + if (!parentItem) { collectionCopy.items.push(clonedItem); } else { parentItem.items.push(clonedItem); @@ -468,11 +493,13 @@ export const cloneItem = (newName, itemUid, collectionUid) => (dispatch, getStat .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_cloneItem({ - parentItemUid: parentItem ? parentItem.uid : null, - clonedItem: clonedItem, - collectionUid: collectionUid - })); + dispatch( + _cloneItem({ + parentItemUid: parentItem ? parentItem.uid : null, + clonedItem: clonedItem, + collectionUid: collectionUid + }) + ); }) .then(() => resolve()) .catch((error) => reject(error)); @@ -484,15 +511,15 @@ export const deleteItem = (itemUid, collectionUid) => (dispatch, getState) => { const collection = findCollectionByUid(state.collections.collections, collectionUid); return new Promise((resolve, reject) => { - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const item = findItemInCollection(collection, itemUid); - if(item) { + if (item) { const { ipcRenderer } = window; - + ipcRenderer .invoke('renderer:delete-item', item.pathname, item.type) .then(() => resolve()) @@ -509,10 +536,12 @@ export const deleteItem = (itemUid, collectionUid) => (dispatch, getState) => { .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_deleteItem({ - itemUid: itemUid, - collectionUid: collectionUid - })); + dispatch( + _deleteItem({ + itemUid: itemUid, + collectionUid: collectionUid + }) + ); }) .then(() => resolve()) .catch((error) => reject(error)); @@ -520,19 +549,12 @@ export const deleteItem = (itemUid, collectionUid) => (dispatch, getState) => { }; export const newHttpRequest = (params) => (dispatch, getState) => { - const { - requestName, - requestType, - requestUrl, - requestMethod, - collectionUid, - itemUid - } = params; + const { requestName, requestType, requestUrl, requestMethod, collectionUid, itemUid } = params; return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } @@ -556,46 +578,40 @@ export const newHttpRequest = (params) => (dispatch, getState) => { } }; - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const filename = resolveRequestFilename(requestName); - if(!itemUid) { + if (!itemUid) { const reqWithSameNameExists = find(collection.items, (i) => i.type !== 'folder' && trim(i.filename) === trim(filename)); - if(!reqWithSameNameExists) { + if (!reqWithSameNameExists) { const fullName = `${collection.pathname}${PATH_SEPARATOR}${filename}`; const { ipcRenderer } = window; - - ipcRenderer - .invoke('renderer:new-request', fullName, item) - .then(resolve) - .catch(reject); + + ipcRenderer.invoke('renderer:new-request', fullName, item).then(resolve).catch(reject); } else { return reject(new Error(`${requestName} already exists in collection`)); } } else { const currentItem = findItemInCollection(collection, itemUid); - if(currentItem) { + if (currentItem) { const reqWithSameNameExists = find(currentItem.items, (i) => i.type !== 'folder' && trim(i.filename) === trim(filename)); - if(!reqWithSameNameExists) { + if (!reqWithSameNameExists) { const fullName = `${currentItem.pathname}${PATH_SEPARATOR}${filename}`; const { ipcRenderer } = window; - - ipcRenderer - .invoke('renderer:new-request', fullName, item) - .then(resolve) - .catch(reject); + + ipcRenderer.invoke('renderer:new-request', fullName, item).then(resolve).catch(reject); } else { return reject(new Error(`${requestName} already exists in the folder`)); } } } return; - }; + } - if(!itemUid) { + if (!itemUid) { collectionCopy.items.push(item); } else { const currentItem = findItemInCollection(collectionCopy, itemUid); - if(currentItem && currentItem.type === 'folder') { + if (currentItem && currentItem.type === 'folder') { currentItem.items = currentItem.items || []; currentItem.items.push(item); } @@ -606,29 +622,33 @@ export const newHttpRequest = (params) => (dispatch, getState) => { .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) .then(() => { - dispatch(_newItem({ - item: item, - currentItemUid: itemUid, - collectionUid: collectionUid - })); + dispatch( + _newItem({ + item: item, + currentItemUid: itemUid, + collectionUid: collectionUid + }) + ); }) .then(waitForNextTick) .then(() => { - dispatch(addTab({ - uid: item.uid, - collectionUid: collection.uid - })); + dispatch( + addTab({ + uid: item.uid, + collectionUid: collection.uid + }) + ); }) .then(() => resolve()) .catch(reject); }); }; -export const addEnvironment = (name, collectionUid) => (dispatch, getState) => { +export const addEnvironment = (name, collectionUid) => (dispatch, getState) => { return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } @@ -643,7 +663,7 @@ export const addEnvironment = (name, collectionUid) => (dispatch, getState) => collectionToSave.environments = collectionToSave.environments || []; collectionToSave.environments.push(environment); - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { environmentsSchema .validate(collectionToSave.environments) .then(() => ipcRenderer.invoke('renderer:save-environment', collection.pathname, collectionToSave.environments)) @@ -655,30 +675,30 @@ export const addEnvironment = (name, collectionUid) => (dispatch, getState) => collectionSchema .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) - .then(() => dispatch(_addEnvironment({environment, collectionUid}))) + .then(() => dispatch(_addEnvironment({ environment, collectionUid }))) .then(resolve) .catch(reject); }); }; -export const renameEnvironment = (newName, environmentUid, collectionUid) => (dispatch, getState) => { +export const renameEnvironment = (newName, environmentUid, collectionUid) => (dispatch, getState) => { return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); const environment = findEnvironmentInCollection(collectionCopy, environmentUid); - if(!environment) { + if (!environment) { return reject(new Error('Environment not found')); } environment.name = newName; const collectionToSave = transformCollectionToSaveToIdb(collectionCopy); - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const environments = collectionToSave.environments; environmentsSchema .validate(environments) @@ -691,31 +711,31 @@ export const renameEnvironment = (newName, environmentUid, collectionUid) => (d collectionSchema .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) - .then(() => dispatch(_renameEnvironment({newName, environmentUid, collectionUid}))) + .then(() => dispatch(_renameEnvironment({ newName, environmentUid, collectionUid }))) .then(resolve) .catch(reject); }); }; -export const deleteEnvironment = (environmentUid, collectionUid) => (dispatch, getState) => { +export const deleteEnvironment = (environmentUid, collectionUid) => (dispatch, getState) => { return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); const environment = findEnvironmentInCollection(collectionCopy, environmentUid); - if(!environment) { + if (!environment) { return reject(new Error('Environment not found')); } collectionCopy.environments = filter(collectionCopy.environments, (e) => e.uid !== environmentUid); const collectionToSave = transformCollectionToSaveToIdb(collectionCopy); - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const environments = collectionToSave.environments; environmentsSchema .validate(environments) @@ -728,7 +748,7 @@ export const deleteEnvironment = (environmentUid, collectionUid) => (dispatch, collectionSchema .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) - .then(() => dispatch(_deleteEnvironment({environmentUid, collectionUid}))) + .then(() => dispatch(_deleteEnvironment({ environmentUid, collectionUid }))) .then(resolve) .catch(reject); }); @@ -738,20 +758,20 @@ export const saveEnvironment = (variables, environmentUid, collectionUid) => (di return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); const environment = findEnvironmentInCollection(collectionCopy, environmentUid); - if(!environment) { + if (!environment) { return reject(new Error('Environment not found')); } environment.variables = variables; const collectionToSave = transformCollectionToSaveToIdb(collectionCopy); - if(isLocalCollection(collection)) { + if (isLocalCollection(collection)) { const environments = collectionToSave.environments; environmentsSchema .validate(environments) @@ -764,7 +784,7 @@ export const saveEnvironment = (variables, environmentUid, collectionUid) => (di collectionSchema .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) - .then(() => dispatch(_saveEnvironment({variables, environmentUid, collectionUid}))) + .then(() => dispatch(_saveEnvironment({ variables, environmentUid, collectionUid }))) .then(resolve) .catch(reject); }); @@ -774,14 +794,14 @@ export const selectEnvironment = (environmentUid, collectionUid) => (dispatch, g return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const collectionCopy = cloneDeep(collection); - if(environmentUid) { + if (environmentUid) { const environment = findEnvironmentInCollection(collectionCopy, environmentUid); - if(!environment) { + if (!environment) { return reject(new Error('Environment not found')); } } @@ -792,7 +812,7 @@ export const selectEnvironment = (environmentUid, collectionUid) => (dispatch, g collectionSchema .validate(collectionToSave) .then(() => saveCollectionToIdb(window.__idb, collectionToSave)) - .then(() => dispatch(_selectEnvironment({environmentUid, collectionUid}))) + .then(() => dispatch(_selectEnvironment({ environmentUid, collectionUid }))) .then(resolve) .catch(reject); }); @@ -802,22 +822,26 @@ export const removeLocalCollection = (collectionUid) => (dispatch, getState) => return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const { ipcRenderer } = window; ipcRenderer .invoke('renderer:remove-collection', collection.pathname) .then(() => { - dispatch(closeTabs({ - tabUids: recursivelyGetAllItemUids(collection.items) - })); + dispatch( + closeTabs({ + tabUids: recursivelyGetAllItemUids(collection.items) + }) + ); }) .then(waitForNextTick) .then(() => { - dispatch(_deleteCollection({ - collectionUid: collectionUid - })); + dispatch( + _deleteCollection({ + collectionUid: collectionUid + }) + ); }) .then(resolve) .catch(reject); @@ -826,18 +850,15 @@ export const removeLocalCollection = (collectionUid) => (dispatch, getState) => export const browserLocalDirectory = () => (dispatch, getState) => { const { ipcRenderer } = window; - + return new Promise((resolve, reject) => { - ipcRenderer - .invoke('renderer:browse-directory') - .then(resolve) - .catch(reject); + ipcRenderer.invoke('renderer:browse-directory').then(resolve).catch(reject); }); -} +}; export const openLocalCollectionEvent = (uid, pathname, name) => (dispatch, getState) => { const localCollection = { - version: "1", + version: '1', uid: uid, name: name, pathname: pathname, @@ -857,10 +878,7 @@ export const createLocalCollection = (collectionName, collectionLocation) => () const { ipcRenderer } = window; return new Promise((resolve, reject) => { - ipcRenderer - .invoke('renderer:create-collection', collectionName, collectionLocation) - .then(resolve) - .catch(reject); + ipcRenderer.invoke('renderer:create-collection', collectionName, collectionLocation).then(resolve).catch(reject); }); }; @@ -868,10 +886,7 @@ export const openLocalCollection = () => () => { return new Promise((resolve, reject) => { const { ipcRenderer } = window; - ipcRenderer - .invoke('renderer:open-collection') - .then(resolve) - .catch(reject); + ipcRenderer.invoke('renderer:open-collection').then(resolve).catch(reject); }); }; @@ -881,16 +896,20 @@ export const localCollectionLoadEnvironmentsEvent = (payload) => (dispatch, getS return new Promise((resolve, reject) => { const state = getState(); const collection = findCollectionByUid(state.collections.collections, meta.collectionUid); - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } environmentsSchema .validate(environments) - .then(() => dispatch(_localCollectionLoadEnvironmentsEvent({ - environments, - collectionUid: meta.collectionUid - }))) + .then(() => + dispatch( + _localCollectionLoadEnvironmentsEvent({ + environments, + collectionUid: meta.collectionUid + }) + ) + ) .then(resolve) .catch(reject); }); diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js index 8d1daac50..4ca807f4b 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js @@ -6,7 +6,7 @@ import concat from 'lodash/concat'; import filter from 'lodash/filter'; import each from 'lodash/each'; import cloneDeep from 'lodash/cloneDeep'; -import { createSlice } from '@reduxjs/toolkit' +import { createSlice } from '@reduxjs/toolkit'; import splitOnFirst from 'split-on-first'; import { findCollectionByUid, @@ -36,7 +36,7 @@ export const collectionsSlice = createSlice({ each(action.payload.collections, (c) => collapseCollection(c)); each(action.payload.collections, (c) => addDepth(c.items)); each(action.payload.collections, (c) => { - if(!collectionUids.includes(c.uid)) { + if (!collectionUids.includes(c.uid)) { state.collections.push(c); collectionUids.push(c.uid); } @@ -47,7 +47,7 @@ export const collectionsSlice = createSlice({ const { collection } = action.payload; collapseCollection(collection); addDepth(collection.items); - if(!collectionUids.includes(collection.uid)) { + if (!collectionUids.includes(collection.uid)) { state.collections.push(collection); } }, @@ -56,25 +56,25 @@ export const collectionsSlice = createSlice({ const collection = action.payload; collapseCollection(collection); addDepth(collection.items); - if(!collectionUids.includes(collection.uid)) { + if (!collectionUids.includes(collection.uid)) { state.collections.push(collection); } }, renameCollection: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { collection.name = action.payload.newName; } }, deleteCollection: (state, action) => { - state.collections = filter(state.collections, c => c.uid !== action.payload.collectionUid); + state.collections = filter(state.collections, (c) => c.uid !== action.payload.collectionUid); }, addEnvironment: (state, action) => { const { environment, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { collection.environments = collection.environments || []; collection.environments.push(environment); } @@ -83,10 +83,10 @@ export const collectionsSlice = createSlice({ const { newName, environmentUid, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { const environment = findEnvironmentInCollection(collection, environmentUid); - if(environment) { + if (environment) { environment.name = newName; } } @@ -95,10 +95,10 @@ export const collectionsSlice = createSlice({ const { environmentUid, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { const environment = findEnvironmentInCollection(collection, environmentUid); - if(environment) { + if (environment) { collection.environments = filter(collection.environments, (e) => e.uid !== environmentUid); } } @@ -107,10 +107,10 @@ export const collectionsSlice = createSlice({ const { variables, environmentUid, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { const environment = findEnvironmentInCollection(collection, environmentUid); - if(environment) { + if (environment) { environment.variables = variables; } } @@ -119,11 +119,11 @@ export const collectionsSlice = createSlice({ const { environmentUid, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { - if(environmentUid) { + if (collection) { + if (environmentUid) { const environment = findEnvironmentInCollection(collection, environmentUid); - if(environment) { + if (environment) { collection.activeEnvironmentUid = environmentUid; } } else { @@ -134,13 +134,13 @@ export const collectionsSlice = createSlice({ newItem: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { - if(!action.payload.currentItemUid) { + if (collection) { + if (!action.payload.currentItemUid) { collection.items.push(action.payload.item); } else { const item = findItemInCollection(collection, action.payload.currentItemUid); - if(item) { + if (item) { item.items = item.items || []; item.items.push(action.payload.item); } @@ -151,17 +151,17 @@ export const collectionsSlice = createSlice({ deleteItem: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { deleteItemInCollection(action.payload.itemUid, collection); } }, renameItem: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item) { + + if (item) { item.name = action.payload.newName; } } @@ -172,8 +172,8 @@ export const collectionsSlice = createSlice({ const parentItemUid = action.payload.parentItemUid; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { - if(parentItemUid) { + if (collection) { + if (parentItemUid) { const parentItem = findItemInCollection(collection, parentItemUid); parentItem.items.push(clonedItem); } else { @@ -182,12 +182,12 @@ export const collectionsSlice = createSlice({ } }, requestSent: (state, action) => { - const {itemUid, collectionUid, cancelTokenUid} = action.payload; + const { itemUid, collectionUid, cancelTokenUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, itemUid); - if(item) { + if (item) { item.response = item.response || {}; item.response.state = 'sending'; item.cancelTokenUid = cancelTokenUid; @@ -195,12 +195,12 @@ export const collectionsSlice = createSlice({ } }, requestCancelled: (state, action) => { - const {itemUid, collectionUid} = action.payload; + const { itemUid, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, itemUid); - if(item) { + if (item) { item.response = null; item.cancelTokenUid = null; } @@ -209,9 +209,9 @@ export const collectionsSlice = createSlice({ responseReceived: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - if(item) { + if (item) { item.response = action.payload.response; item.cancelTokenUid = null; } @@ -220,10 +220,10 @@ export const collectionsSlice = createSlice({ saveRequest: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && item.draft) { + + if (item && item.draft) { item.request = item.draft.request; item.draft = null; } @@ -232,7 +232,7 @@ export const collectionsSlice = createSlice({ newEphermalHttpRequest: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection && collection.items && collection.items.length) { + if (collection && collection.items && collection.items.length) { const item = { uid: action.payload.uid, name: action.payload.requestName, @@ -256,17 +256,17 @@ export const collectionsSlice = createSlice({ collectionClicked: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload); - if(collection) { + if (collection) { collection.collapsed = !collection.collapsed; } }, collectionFolderClicked: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - if(item && item.type === 'folder') { + if (item && item.type === 'folder') { item.collapsed = !item.collapsed; } } @@ -274,11 +274,11 @@ export const collectionsSlice = createSlice({ requestUrlChanged: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - if(item && isItemARequest(item)) { - if(!item.draft) { + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.url = action.payload.url; @@ -295,7 +295,7 @@ export const collectionsSlice = createSlice({ urlParam.enabled = true; // once found, remove it - trying our best here to accomodate duplicate query params - if(existingParam) { + if (existingParam) { enabledParams = filter(enabledParams, (p) => p.uid !== existingParam.uid); } }); @@ -310,11 +310,11 @@ export const collectionsSlice = createSlice({ addQueryParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.params = item.draft.request.params || []; @@ -331,15 +331,15 @@ export const collectionsSlice = createSlice({ updateQueryParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } const param = find(item.draft.request.params, (h) => h.uid === action.payload.param.uid); - if(param) { + if (param) { param.name = action.payload.param.name; param.value = action.payload.param.value; param.description = action.payload.param.description; @@ -347,18 +347,18 @@ export const collectionsSlice = createSlice({ // update request url const parts = splitOnFirst(item.draft.request.url, '?'); - const query = stringifyQueryParams(filter(item.draft.request.params, p => p.enabled)); + const query = stringifyQueryParams(filter(item.draft.request.params, (p) => p.enabled)); // if no query is found, then strip the query params in url - if(!query || !query.length) { - if(parts.length) { + if (!query || !query.length) { + if (parts.length) { item.draft.request.url = parts[0]; } return; } // if no parts were found, then append the query - if(!parts.length) { + if (!parts.length) { item.draft.request.url += '?' + query; return; } @@ -372,19 +372,19 @@ export const collectionsSlice = createSlice({ deleteQueryParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.params = filter(item.draft.request.params, (p) => p.uid !== action.payload.paramUid); // update request url const parts = splitOnFirst(item.draft.request.url, '?'); - const query = stringifyQueryParams(filter(item.draft.request.params, p => p.enabled)); - if(query && query.length) { + const query = stringifyQueryParams(filter(item.draft.request.params, (p) => p.enabled)); + if (query && query.length) { item.draft.request.url = parts[0] + '?' + query; } else { item.draft.request.url = parts[0]; @@ -395,11 +395,11 @@ export const collectionsSlice = createSlice({ addRequestHeader: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.headers = item.draft.request.headers || []; @@ -416,15 +416,15 @@ export const collectionsSlice = createSlice({ updateRequestHeader: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } const header = find(item.draft.request.headers, (h) => h.uid === action.payload.header.uid); - if(header) { + if (header) { header.name = action.payload.header.name; header.value = action.payload.header.value; header.description = action.payload.header.description; @@ -436,11 +436,11 @@ export const collectionsSlice = createSlice({ deleteRequestHeader: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.headers = filter(item.draft.request.headers, (h) => h.uid !== action.payload.headerUid); @@ -450,11 +450,11 @@ export const collectionsSlice = createSlice({ addFormUrlEncodedParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.body.formUrlEncoded = item.draft.request.body.formUrlEncoded || []; @@ -471,15 +471,15 @@ export const collectionsSlice = createSlice({ updateFormUrlEncodedParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } const param = find(item.draft.request.body.formUrlEncoded, (p) => p.uid === action.payload.param.uid); - if(param) { + if (param) { param.name = action.payload.param.name; param.value = action.payload.param.value; param.description = action.payload.param.description; @@ -491,11 +491,11 @@ export const collectionsSlice = createSlice({ deleteFormUrlEncodedParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.body.formUrlEncoded = filter(item.draft.request.body.formUrlEncoded, (p) => p.uid !== action.payload.paramUid); @@ -505,11 +505,11 @@ export const collectionsSlice = createSlice({ addMultipartFormParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.body.multipartForm = item.draft.request.body.multipartForm || []; @@ -526,15 +526,15 @@ export const collectionsSlice = createSlice({ updateMultipartFormParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } const param = find(item.draft.request.body.multipartForm, (p) => p.uid === action.payload.param.uid); - if(param) { + if (param) { param.name = action.payload.param.name; param.value = action.payload.param.value; param.description = action.payload.param.description; @@ -546,11 +546,11 @@ export const collectionsSlice = createSlice({ deleteMultipartFormParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.body.multipartForm = filter(item.draft.request.body.multipartForm, (p) => p.uid !== action.payload.paramUid); @@ -560,11 +560,11 @@ export const collectionsSlice = createSlice({ updateRequestBodyMode: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.body.mode = action.payload.mode; @@ -574,14 +574,14 @@ export const collectionsSlice = createSlice({ updateRequestBody: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } - switch(item.draft.request.body.mode) { + switch (item.draft.request.body.mode) { case 'json': { item.draft.request.body.json = action.payload.content; break; @@ -609,11 +609,11 @@ export const collectionsSlice = createSlice({ updateRequestMethod: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, action.payload.itemUid); - - if(item && isItemARequest(item)) { - if(!item.draft) { + + if (item && isItemARequest(item)) { + if (!item.draft) { item.draft = cloneDeep(item); } item.draft.request.method = action.payload.method; @@ -624,13 +624,13 @@ export const collectionsSlice = createSlice({ const file = action.payload.file; const collection = findCollectionByUid(state.collections, file.meta.collectionUid); - if(collection) { + if (collection) { const dirname = path.dirname(file.meta.pathname); const subDirectories = getSubdirectoriesFromRoot(collection.pathname, dirname); let currentPath = collection.pathname; let currentSubItems = collection.items; for (const directoryName of subDirectories) { - let childItem = currentSubItems.find(f => f.type === 'folder' && f.name === directoryName) + let childItem = currentSubItems.find((f) => f.type === 'folder' && f.name === directoryName); if (!childItem) { childItem = { uid: uuid(), @@ -642,17 +642,17 @@ export const collectionsSlice = createSlice({ }; currentSubItems.push(childItem); } - + currentPath = `${currentPath}${PATH_SEPARATOR}${directoryName}`; currentSubItems = childItem.items; } - if (!currentSubItems.find(f => f.name === file.meta.name)) { + if (!currentSubItems.find((f) => f.name === file.meta.name)) { // this happens when you rename a file // the add event might get triggered first, before the unlink event // this results in duplicate uids causing react renderer to go mad const currentItem = find(currentSubItems, (i) => i.uid === file.data.uid); - if(currentItem) { + if (currentItem) { currentItem.name = file.data.name; currentItem.type = file.data.type; currentItem.request = file.data.request; @@ -678,12 +678,12 @@ export const collectionsSlice = createSlice({ const { dir } = action.payload; const collection = findCollectionByUid(state.collections, dir.meta.collectionUid); - if(collection) { + if (collection) { const subDirectories = getSubdirectoriesFromRoot(collection.pathname, dir.meta.pathname); let currentPath = collection.pathname; let currentSubItems = collection.items; for (const directoryName of subDirectories) { - let childItem = currentSubItems.find(f => f.type === 'folder' && f.name === directoryName); + let childItem = currentSubItems.find((f) => f.type === 'folder' && f.name === directoryName); if (!childItem) { childItem = { uid: uuid(), @@ -695,7 +695,7 @@ export const collectionsSlice = createSlice({ }; currentSubItems.push(childItem); } - + currentPath = `${currentPath}${PATH_SEPARATOR}${directoryName}`; currentSubItems = childItem.items; } @@ -706,10 +706,10 @@ export const collectionsSlice = createSlice({ const { file } = action.payload; const collection = findCollectionByUid(state.collections, file.meta.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollection(collection, file.data.uid); - if(item) { + if (item) { item.name = file.data.name; item.type = file.data.type; item.request = file.data.request; @@ -723,10 +723,10 @@ export const collectionsSlice = createSlice({ const { file } = action.payload; const collection = findCollectionByUid(state.collections, file.meta.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollectionByPathname(collection, file.meta.pathname); - if(item) { + if (item) { deleteItemInCollection(item.uid, collection); } } @@ -735,22 +735,22 @@ export const collectionsSlice = createSlice({ const { directory } = action.payload; const collection = findCollectionByUid(state.collections, directory.meta.collectionUid); - if(collection) { + if (collection) { const item = findItemInCollectionByPathname(collection, directory.meta.pathname); - if(item) { + if (item) { deleteItemInCollection(item.uid, collection); } } }, - localCollectionLoadEnvironmentsEvent: (state, action) => { + localCollectionLoadEnvironmentsEvent: (state, action) => { const { environments, collectionUid } = action.payload; const collection = findCollectionByUid(state.collections, collectionUid); - if(collection) { + if (collection) { collection.environments = environments; } - }, + } } }); diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/tabs.js b/packages/bruno-app/src/providers/ReduxStore/slices/tabs.js index 91b6e7d60..bc6f1d52d 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/tabs.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/tabs.js @@ -1,7 +1,7 @@ import find from 'lodash/find'; import filter from 'lodash/filter'; import last from 'lodash/last'; -import { createSlice } from '@reduxjs/toolkit' +import { createSlice } from '@reduxjs/toolkit'; // todo: errors should be tracked in each slice and displayed as toasts @@ -16,7 +16,7 @@ export const tabsSlice = createSlice({ reducers: { addTab: (state, action) => { const alreadyExists = find(state.tabs, (tab) => tab.uid === action.payload.uid); - if(alreadyExists) { + if (alreadyExists) { return; } state.tabs.push({ @@ -34,21 +34,21 @@ export const tabsSlice = createSlice({ updateRequestPaneTabWidth: (state, action) => { const tab = find(state.tabs, (t) => t.uid === action.payload.uid); - if(tab) { + if (tab) { tab.requestPaneWidth = action.payload.requestPaneWidth; } }, updateRequestPaneTab: (state, action) => { const tab = find(state.tabs, (t) => t.uid === action.payload.uid); - if(tab) { + if (tab) { tab.requestPaneTab = action.payload.requestPaneTab; } }, updateResponsePaneTab: (state, action) => { const tab = find(state.tabs, (t) => t.uid === action.payload.uid); - if(tab) { + if (tab) { tab.responsePaneTab = action.payload.responsePaneTab; } }, @@ -57,15 +57,15 @@ export const tabsSlice = createSlice({ const tabUids = action.payload.tabUids || []; state.tabs = filter(state.tabs, (t) => !tabUids.includes(t.uid)); - if(activeTab && state.tabs.length) { + if (activeTab && state.tabs.length) { const { collectionUid } = activeTab; const activeTabStillExists = find(state.tabs, (t) => t.uid === state.activeTabUid); - if(!activeTabStillExists) { + if (!activeTabStillExists) { // attempt to load sibling tabs (based on collections) of the dead tab const siblingTabs = filter(state.tabs, (t) => t.collectionUid === collectionUid); - if(siblingTabs && siblingTabs.length) { + if (siblingTabs && siblingTabs.length) { state.activeTabUid = last(siblingTabs).uid; } else { state.activeTabUid = last(state.tabs).uid; @@ -73,20 +73,13 @@ export const tabsSlice = createSlice({ } } - if(!state.tabs || !state.tabs.length) { + if (!state.tabs || !state.tabs.length) { state.activeTabUid = null; } } } }); -export const { - addTab, - focusTab, - updateRequestPaneTabWidth, - updateRequestPaneTab, - updateResponsePaneTab, - closeTabs -} = tabsSlice.actions; +export const { addTab, focusTab, updateRequestPaneTabWidth, updateRequestPaneTab, updateResponsePaneTab, closeTabs } = tabsSlice.actions; export default tabsSlice.reducer; diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/actions.js b/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/actions.js index dfef6d081..a39b0fbde 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/actions.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/actions.js @@ -35,15 +35,19 @@ export const loadWorkspacesFromIdb = () => (dispatch) => { return new Promise((resolve, reject) => { getWorkspacesFromIdb(window.__idb) .then((workspaces) => { - if(!workspaces || !workspaces.length) { + if (!workspaces || !workspaces.length) { return seedWorkpace(); } return workspaces; }) - .then((workspaces) => dispatch(loadWorkspaces({ - workspaces: workspaces - }))) + .then((workspaces) => + dispatch( + loadWorkspaces({ + workspaces: workspaces + }) + ) + ) .then(resolve) .catch(reject); }); @@ -60,9 +64,13 @@ export const addWorkspace = (workspaceName) => (dispatch) => { workspaceSchema .validate(newWorkspace) .then(() => saveWorkspaceToIdb(window.__idb, newWorkspace)) - .then(() => dispatch(_addWorkspace({ - workspace: newWorkspace - }))) + .then(() => + dispatch( + _addWorkspace({ + workspace: newWorkspace + }) + ) + ) .then(resolve) .catch(reject); }); @@ -74,7 +82,7 @@ export const renameWorkspace = (newName, uid) => (dispatch, getState) => { return new Promise((resolve, reject) => { const workspace = find(state.workspaces.workspaces, (w) => w.uid === uid); - if(!workspace) { + if (!workspace) { return reject(new Error('Workspace not found')); } @@ -84,10 +92,14 @@ export const renameWorkspace = (newName, uid) => (dispatch, getState) => { workspaceSchema .validate(workspaceCopy) .then(() => saveWorkspaceToIdb(window.__idb, workspaceCopy)) - .then(() => dispatch(_renameWorkspace({ - uid: uid, - name: newName - }))) + .then(() => + dispatch( + _renameWorkspace({ + uid: uid, + name: newName + }) + ) + ) .then(resolve) .catch(reject); }); @@ -97,20 +109,24 @@ export const deleteWorkspace = (workspaceUid) => (dispatch, getState) => { const state = getState(); return new Promise((resolve, reject) => { - if(state.workspaces.activeWorkspaceUid === workspaceUid) { - throw new Error("User cannot delete current workspace"); + if (state.workspaces.activeWorkspaceUid === workspaceUid) { + throw new Error('User cannot delete current workspace'); } const workspace = find(state.workspaces.workspaces, (w) => w.uid === workspaceUid); - if(!workspace) { + if (!workspace) { return reject(new Error('Workspace not found')); } deleteWorkspaceInIdb(window.__idb, workspaceUid) - .then(() => dispatch(_deleteWorkspace({ - workspaceUid: workspaceUid - }))) + .then(() => + dispatch( + _deleteWorkspace({ + workspaceUid: workspaceUid + }) + ) + ) .then(resolve) .catch(reject); }); @@ -123,34 +139,40 @@ export const addCollectionToWorkspace = (workspaceUid, collectionUid) => (dispat const workspace = find(state.workspaces.workspaces, (w) => w.uid === workspaceUid); const collection = find(state.collections.collections, (c) => c.uid === collectionUid); - if(!workspace) { + if (!workspace) { return reject(new Error('Workspace not found')); } - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const workspaceCopy = cloneDeep(workspace); - if(workspaceCopy.collections && workspace.collections.length) { - if(!findCollectionInWorkspace(workspace, collectionUid)) { + if (workspaceCopy.collections && workspace.collections.length) { + if (!findCollectionInWorkspace(workspace, collectionUid)) { workspaceCopy.collections.push({ uid: collectionUid }); } } else { - workspaceCopy.collections = [{ - uid: collectionUid - }]; + workspaceCopy.collections = [ + { + uid: collectionUid + } + ]; } workspaceSchema .validate(workspaceCopy) .then(() => saveWorkspaceToIdb(window.__idb, workspaceCopy)) - .then(() => dispatch(_addCollectionToWorkspace({ - workspaceUid: workspaceUid, - collectionUid: collectionUid - }))) + .then(() => + dispatch( + _addCollectionToWorkspace({ + workspaceUid: workspaceUid, + collectionUid: collectionUid + }) + ) + ) .then(resolve) .catch(reject); }); @@ -163,26 +185,30 @@ export const removeCollectionFromWorkspace = (workspaceUid, collectionUid) => (d const workspace = find(state.workspaces.workspaces, (w) => w.uid === workspaceUid); const collection = find(state.collections.collections, (c) => c.uid === collectionUid); - if(!workspace) { + if (!workspace) { return reject(new Error('Workspace not found')); } - if(!collection) { + if (!collection) { return reject(new Error('Collection not found')); } const workspaceCopy = cloneDeep(workspace); - if(workspaceCopy.collections && workspace.collections.length) { + if (workspaceCopy.collections && workspace.collections.length) { workspaceCopy.collections = filter(workspaceCopy.collections, (c) => c.uid !== collectionUid); } workspaceSchema .validate(workspaceCopy) .then(() => saveWorkspaceToIdb(window.__idb, workspaceCopy)) - .then(() => dispatch(_removeCollectionFromWorkspace({ - workspaceUid: workspaceUid, - collectionUid: collectionUid - }))) + .then(() => + dispatch( + _removeCollectionFromWorkspace({ + workspaceUid: workspaceUid, + collectionUid: collectionUid + }) + ) + ) .then(resolve) .catch(reject); }); @@ -192,4 +218,4 @@ export const removeCollectionFromWorkspace = (workspaceUid, collectionUid) => (d // Workspaces can have collection uids that no longer exist // or the user may have the collections access revoked (in teams) // This action will have to be called at the beginning to purge any zombi collection references in the workspaces -export const removeZombieCollectionFromAllWorkspaces = (workspaceUid) => (dispatch, getState) => {}; \ No newline at end of file +export const removeZombieCollectionFromAllWorkspaces = (workspaceUid) => (dispatch, getState) => {}; diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/index.js b/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/index.js index 2d2623ead..1be9e6415 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/index.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/workspaces/index.js @@ -17,10 +17,10 @@ export const workspacesSlice = createSlice({ loadWorkspaces: (state, action) => { state.workspaces = action.payload.workspaces; - if(state.workspaces && state.workspaces.length) { + if (state.workspaces && state.workspaces.length) { const workspaceUids = map(state.workspaces, (w) => w.uid); const activeWorkspaceUid = cache.getActiveWorkspaceUid(); - if(activeWorkspaceUid && workspaceUids.includes(activeWorkspaceUid)) { + if (activeWorkspaceUid && workspaceUids.includes(activeWorkspaceUid)) { state.activeWorkspaceUid = activeWorkspaceUid; } else { state.activeWorkspaceUid = state.workspaces[0].uid; @@ -36,56 +36,50 @@ export const workspacesSlice = createSlice({ const { name, uid } = action.payload; const workspace = find(state.workspaces, (w) => w.uid === uid); - if(workspace) { + if (workspace) { workspace.name = name; } }, deleteWorkspace: (state, action) => { - if(state.activeWorkspaceUid === action.payload.workspaceUid) { - throw new Error("User cannot delete current workspace"); + if (state.activeWorkspaceUid === action.payload.workspaceUid) { + throw new Error('User cannot delete current workspace'); } state.workspaces = state.workspaces.filter((workspace) => workspace.uid !== action.payload.workspaceUid); }, addWorkspace: (state, action) => { state.workspaces.push(action.payload.workspace); }, - addCollectionToWorkspace: (state, action) => { + addCollectionToWorkspace: (state, action) => { const { workspaceUid, collectionUid } = action.payload; const workspace = find(state.workspaces, (w) => w.uid === workspaceUid); - if(workspace) { - if(workspace.collections && workspace.collections.length) { - if(!findCollectionInWorkspace(workspace, collectionUid)) { + if (workspace) { + if (workspace.collections && workspace.collections.length) { + if (!findCollectionInWorkspace(workspace, collectionUid)) { workspace.collections.push({ uid: collectionUid }); } } else { - workspace.collections = [{ - uid: collectionUid - }]; + workspace.collections = [ + { + uid: collectionUid + } + ]; } } }, - removeCollectionFromWorkspace: (state, action) => { + removeCollectionFromWorkspace: (state, action) => { const { workspaceUid, collectionUid } = action.payload; const workspace = find(state.workspaces, (w) => w.uid === workspaceUid); - if(workspace && workspace.collections && workspace.collections.length) { + if (workspace && workspace.collections && workspace.collections.length) { workspace.collections = filter(workspace.collections, (c) => c.uid !== collectionUid); } } } }); -export const { - loadWorkspaces, - selectWorkspace, - renameWorkspace, - deleteWorkspace, - addWorkspace, - addCollectionToWorkspace, - removeCollectionFromWorkspace -} = workspacesSlice.actions; +export const { loadWorkspaces, selectWorkspace, renameWorkspace, deleteWorkspace, addWorkspace, addCollectionToWorkspace, removeCollectionFromWorkspace } = workspacesSlice.actions; export default workspacesSlice.reducer; diff --git a/packages/bruno-app/src/utils/collections/export.js b/packages/bruno-app/src/utils/collections/export.js index a9434ef44..579feaeb0 100644 --- a/packages/bruno-app/src/utils/collections/export.js +++ b/packages/bruno-app/src/utils/collections/export.js @@ -2,9 +2,9 @@ import * as FileSaver from 'file-saver'; const exportCollection = (collection) => { const fileName = `${collection.name}.json`; - const fileBlob = new Blob([JSON.stringify(collection, null, 2)], { type: "application/json" }) + const fileBlob = new Blob([JSON.stringify(collection, null, 2)], { type: 'application/json' }); FileSaver.saveAs(fileBlob, fileName); }; -export default exportCollection; \ No newline at end of file +export default exportCollection; diff --git a/packages/bruno-app/src/utils/collections/import.js b/packages/bruno-app/src/utils/collections/import.js index 0764d3670..e6b087da0 100644 --- a/packages/bruno-app/src/utils/collections/import.js +++ b/packages/bruno-app/src/utils/collections/import.js @@ -22,7 +22,7 @@ const parseJsonCollection = (str) => { let parsed = JSON.parse(str); return resolve(parsed); } catch (err) { - toast.error("Unable to parse the collection json file"); + toast.error('Unable to parse the collection json file'); reject(err); } }); @@ -35,13 +35,12 @@ const validateSchema = (collection = {}) => { .validate(collection) .then(() => resolve(collection)) .catch((err) => { - toast.error("The Collection file is corrupted"); + toast.error('The Collection file is corrupted'); reject(err); }); }); }; - const updateUidsInCollection = (collection) => { collection.uid = uuid(); @@ -49,16 +48,16 @@ const updateUidsInCollection = (collection) => { each(items, (item) => { item.uid = uuid(); - each(get(item, 'request.headers'), (header) => header.uid = uuid()); - each(get(item, 'request.params'), (param) => param.uid = uuid()); - each(get(item, 'request.body.multipartForm'), (param) => param.uid = uuid()); - each(get(item, 'request.body.formUrlEncoded'), (param) => param.uid = uuid()); + each(get(item, 'request.headers'), (header) => (header.uid = uuid())); + each(get(item, 'request.params'), (param) => (param.uid = uuid())); + each(get(item, 'request.body.multipartForm'), (param) => (param.uid = uuid())); + each(get(item, 'request.body.formUrlEncoded'), (param) => (param.uid = uuid())); - if(item.items && item.items.length) { + if (item.items && item.items.length) { updateItemUids(item.items); } - }) - } + }); + }; updateItemUids(collection.items); return collection; @@ -66,7 +65,7 @@ const updateUidsInCollection = (collection) => { const importCollection = () => { return new Promise((resolve, reject) => { - fileDialog({accept: 'application/json'}) + fileDialog({ accept: 'application/json' }) .then(readFile) .then(parseJsonCollection) .then(validateSchema) @@ -74,11 +73,11 @@ const importCollection = () => { .then(validateSchema) .then((collection) => saveCollectionToIdb(window.__idb, collection)) .then((collection) => { - toast.success("Collection imported successfully"); + toast.success('Collection imported successfully'); resolve(collection); }) .catch((err) => { - toast.error("Import collection failed"); + toast.error('Import collection failed'); reject(err); }); }); @@ -96,4 +95,4 @@ export const importSampleCollection = () => { }); }; -export default importCollection; \ No newline at end of file +export default importCollection; diff --git a/packages/bruno-app/src/utils/collections/index.js b/packages/bruno-app/src/utils/collections/index.js index bf47700c1..cb3cade47 100644 --- a/packages/bruno-app/src/utils/collections/index.js +++ b/packages/bruno-app/src/utils/collections/index.js @@ -9,7 +9,7 @@ import sortBy from 'lodash/sortBy'; import { uuid } from 'utils/common'; const replaceTabsWithSpaces = (str, numSpaces = 2) => { - if(!str || !str.length || !isString(str)) { + if (!str || !str.length || !isString(str)) { return ''; } @@ -21,11 +21,11 @@ export const addDepth = (items = []) => { each(itms, (i) => { i.depth = initialDepth; - if(i.items && i.items.length) { + if (i.items && i.items.length) { depth(i.items, initialDepth + 1); } - }) - } + }); + }; depth(items, 1); }; @@ -37,23 +37,23 @@ export const collapseCollection = (collection) => { each(items, (i) => { i.collapsed = true; - if(i.items && i.items.length) { + if (i.items && i.items.length) { collapseItem(i.items); } - }) - } + }); + }; collapseItem(collection.items, 1); }; export const sortItems = (collection) => { const sort = (obj) => { - if(obj.items && obj.items.length) { + if (obj.items && obj.items.length) { obj.items = sortBy(obj.items, 'type'); } each(obj.items, (i) => sort(i)); - } + }; sort(collection); }; @@ -65,11 +65,11 @@ export const flattenItems = (items = []) => { each(itms, (i) => { flattened.push(i); - if(i.items && i.items.length) { + if (i.items && i.items.length) { flatten(i.items, flattened); } - }) - } + }); + }; flatten(items, flattenedItems); @@ -96,21 +96,21 @@ export const findItemInCollectionByPathname = (collection, pathname) => { let flattenedItems = flattenItems(collection.items); return findItemByPathname(flattenedItems, pathname); -} +}; export const findItemInCollection = (collection, itemUid) => { let flattenedItems = flattenItems(collection.items); return findItem(flattenedItems, itemUid); -} +}; export const findParentItemInCollection = (collection, itemUid) => { let flattenedItems = flattenItems(collection.items); return find(flattenedItems, (item) => { - return item.items && find(item.items, i => i.uid === itemUid); + return item.items && find(item.items, (i) => i.uid === itemUid); }); -} +}; export const recursivelyGetAllItemUids = (items = []) => { let flattenedItems = flattenItems(items); @@ -120,7 +120,7 @@ export const recursivelyGetAllItemUids = (items = []) => { export const findEnvironmentInCollection = (collection, envUid) => { return find(collection.environments, (e) => e.uid === envUid); -} +}; export const transformCollectionToSaveToIdb = (collection, options = {}) => { const copyHeaders = (headers) => { @@ -131,7 +131,7 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { value: header.value, description: header.description, enabled: header.enabled - } + }; }); }; @@ -143,7 +143,7 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { value: param.value, description: param.description, enabled: param.enabled - } + }; }); }; @@ -155,7 +155,7 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { value: param.value, description: param.description, enabled: param.enabled - } + }; }); }; @@ -167,7 +167,7 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { value: param.value, description: param.description, enabled: param.enabled - } + }; }); }; @@ -184,8 +184,8 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { // The condition "!options.ignoreDraft" may appear confusing // When saving a collection, this option allows the caller to specify to ignore any draft changes while still saving rest of the collection. // This is useful for performing rename request/collections while still leaving changes in draft not making its way into the indexeddb - if(si.draft && !options.ignoreDraft) { - if(si.draft.request) { + if (si.draft && !options.ignoreDraft) { + if (si.draft.request) { di.request = { url: si.draft.request.url, method: si.draft.request.method, @@ -203,13 +203,13 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { }; } } else { - if(si.request) { + if (si.request) { di.request = { url: si.request.url, method: si.request.method, headers: copyHeaders(si.request.headers), params: copyQueryParams(si.request.params), - body: { + body: { mode: si.request.body.mode, json: si.request.body.json, text: si.request.body.text, @@ -217,27 +217,27 @@ export const transformCollectionToSaveToIdb = (collection, options = {}) => { formUrlEncoded: copyFormUrlEncodedParams(si.request.body.formUrlEncoded), multipartForm: copyMultipartFormParams(si.request.body.multipartForm) } - } - }; + }; + } } - if(di.request && di.request.body.mode === 'json') { + if (di.request && di.request.body.mode === 'json') { di.request.body.json = replaceTabsWithSpaces(di.request.body.json); } destItems.push(di); - if(si.items && si.items.length) { + if (si.items && si.items.length) { di.items = []; copyItems(si.items, di.items); } }); - } + }; const collectionToSave = {}; collectionToSave.name = collection.name; collectionToSave.uid = collection.uid; - + // todo: move this to the place where collection gets created collectionToSave.version = '1'; collectionToSave.items = []; @@ -280,11 +280,11 @@ export const transformRequestToSaveToFilesystem = (item) => { name: header.name, value: header.value, description: header.description, - enabled: header.enabled, + enabled: header.enabled }); }); - if(itemToSave.request.body.mode === 'json') { + if (itemToSave.request.body.mode === 'json') { itemToSave.request.body.json = replaceTabsWithSpaces(itemToSave.request.body.json); } @@ -298,16 +298,14 @@ export const deleteItemInCollection = (itemUid, collection) => { let flattenedItems = flattenItems(collection.items); each(flattenedItems, (i) => { - if(i.items && i.items.length) { + if (i.items && i.items.length) { i.items = filter(i.items, (i) => i.uid !== itemUid); } }); }; export const isItemARequest = (item) => { - return item.hasOwnProperty('request') - && ['http-request', 'graphql-request'].includes(item.type) - && !item.items; + return item.hasOwnProperty('request') && ['http-request', 'graphql-request'].includes(item.type) && !item.items; }; export const isItemAFolder = (item) => { @@ -316,7 +314,7 @@ export const isItemAFolder = (item) => { export const humanizeRequestBodyMode = (mode) => { let label = 'No Body'; - switch(mode) { + switch (mode) { case 'json': { label = 'JSON'; break; @@ -345,13 +343,13 @@ export const humanizeRequestBodyMode = (mode) => { export const refreshUidsInItem = (item) => { item.uid = uuid(); - each(get(item, 'request.headers'), (header) => header.uid = uuid()); - each(get(item, 'request.params'), (param) => param.uid = uuid()); - each(get(item, 'request.body.multipartForm'), (param) => param.uid = uuid()); - each(get(item, 'request.body.formUrlEncoded'), (param) => param.uid = uuid()); + each(get(item, 'request.headers'), (header) => (header.uid = uuid())); + each(get(item, 'request.params'), (param) => (param.uid = uuid())); + each(get(item, 'request.body.multipartForm'), (param) => (param.uid = uuid())); + each(get(item, 'request.body.formUrlEncoded'), (param) => (param.uid = uuid())); return item; -} +}; export const isLocalCollection = (collection) => { return collection.pathname ? true : false; @@ -367,7 +365,7 @@ export const interpolateEnvironmentVars = (item, variables) => { const templateOpts = { interpolate: /{{([\s\S]+?)}}/g, //interpolate content using markers `{{}}` evaluate: null, // prevent any js evaluation - escape: null, // disable any escaping + escape: null // disable any escaping }; const interpolate = (str) => template(str, templateOpts)(envVars); @@ -382,7 +380,7 @@ export const interpolateEnvironmentVars = (item, variables) => { }); // Todo: Make interpolation work with body mode json - switch(request.body.mode) { + switch (request.body.mode) { case 'text': { request.body.text = interpolate(request.body.text); break; @@ -406,4 +404,4 @@ export const interpolateEnvironmentVars = (item, variables) => { } return request; -}; \ No newline at end of file +}; diff --git a/packages/bruno-app/src/utils/collections/samples/sample-collection.json b/packages/bruno-app/src/utils/collections/samples/sample-collection.json index e7fc42b25..51468b5ef 100644 --- a/packages/bruno-app/src/utils/collections/samples/sample-collection.json +++ b/packages/bruno-app/src/utils/collections/samples/sample-collection.json @@ -126,4 +126,4 @@ } ], "environments": [] -} \ No newline at end of file +} diff --git a/packages/bruno-app/src/utils/collections/search.js b/packages/bruno-app/src/utils/collections/search.js index c266cf6b1..b420687b7 100644 --- a/packages/bruno-app/src/utils/collections/search.js +++ b/packages/bruno-app/src/utils/collections/search.js @@ -1,21 +1,21 @@ -import { flattenItems, isItemARequest } from "./index"; +import { flattenItems, isItemARequest } from './index'; import filter from 'lodash/filter'; import find from 'lodash/find'; - + export const doesRequestMatchSearchText = (request, searchText = '') => { - return request.name.toLowerCase().includes(searchText.toLowerCase()); + return request.name.toLowerCase().includes(searchText.toLowerCase()); }; export const doesFolderHaveItemsMatchSearchText = (item, searchText = '') => { - let flattenedItems = flattenItems(item.items); - let requestItems = filter(flattenedItems, (item) => isItemARequest(item)); - - return find(requestItems, (request) => doesRequestMatchSearchText(request, searchText)); + let flattenedItems = flattenItems(item.items); + let requestItems = filter(flattenedItems, (item) => isItemARequest(item)); + + return find(requestItems, (request) => doesRequestMatchSearchText(request, searchText)); }; export const doesCollectionHaveItemsMatchingSearchText = (collection, searchText = '') => { - let flattenedItems = flattenItems(collection.items); - let requestItems = filter(flattenedItems, (item) => isItemARequest(item)); - - return find(requestItems, (request) => doesRequestMatchSearchText(request, searchText)); -} \ No newline at end of file + let flattenedItems = flattenItems(collection.items); + let requestItems = filter(flattenedItems, (item) => isItemARequest(item)); + + return find(requestItems, (request) => doesRequestMatchSearchText(request, searchText)); +}; diff --git a/packages/bruno-app/src/utils/common/cache.js b/packages/bruno-app/src/utils/common/cache.js index 30bab61f9..88517f203 100644 --- a/packages/bruno-app/src/utils/common/cache.js +++ b/packages/bruno-app/src/utils/common/cache.js @@ -13,6 +13,6 @@ class Cache { setActiveWorkspaceUid(workspaceUid) { this.set('bruno.activeWorkspaceUid', workspaceUid); } -}; +} -module.exports = new Cache();; +module.exports = new Cache(); diff --git a/packages/bruno-app/src/utils/common/error.js b/packages/bruno-app/src/utils/common/error.js index 4ffddc3ea..6096099cd 100644 --- a/packages/bruno-app/src/utils/common/error.js +++ b/packages/bruno-app/src/utils/common/error.js @@ -4,13 +4,13 @@ import toast from 'react-hot-toast'; export class BrunoError extends Error { constructor(message, level) { super(message); - this.name = "BrunoError"; - this.level = level || "error"; + this.name = 'BrunoError'; + this.level = level || 'error'; } } export const parseError = (error) => { - if(error instanceof BrunoError) { + if (error instanceof BrunoError) { return error.message; } @@ -18,8 +18,8 @@ export const parseError = (error) => { }; export const toastError = (error) => { - if(error instanceof BrunoError) { - if(error.level === 'warning') { + if (error instanceof BrunoError) { + if (error.level === 'warning') { return toast(error.message, { icon: '⚠️', duration: 3000 diff --git a/packages/bruno-app/src/utils/common/index.js b/packages/bruno-app/src/utils/common/index.js index d54475f08..b88c587e2 100644 --- a/packages/bruno-app/src/utils/common/index.js +++ b/packages/bruno-app/src/utils/common/index.js @@ -4,12 +4,12 @@ import { customAlphabet } from 'nanoid'; export const uuid = () => { // https://github.com/ai/nanoid/blob/main/url-alphabet/index.js const urlAlphabet = 'useandom26T198340PX75pxJACKVERYMINDBUSHWOLFGQZbfghjklqvwyzrict'; - const customNanoId = customAlphabet (urlAlphabet, 21); + const customNanoId = customAlphabet(urlAlphabet, 21); return customNanoId(); }; -export const simpleHash = str => { +export const simpleHash = (str) => { let hash = 0; for (let i = 0; i < str.length; i++) { const char = str.charCodeAt(i); diff --git a/packages/bruno-app/src/utils/common/platform.js b/packages/bruno-app/src/utils/common/platform.js index 2f0218c30..19b27925a 100644 --- a/packages/bruno-app/src/utils/common/platform.js +++ b/packages/bruno-app/src/utils/common/platform.js @@ -2,7 +2,7 @@ import trim from 'lodash/trim'; import path from 'path'; export const isElectron = () => { - if(!window) { + if (!window) { return false; } @@ -24,4 +24,3 @@ export const getSubdirectoriesFromRoot = (rootPath, pathname) => { const relativePath = path.relative(rootPath, pathname); return relativePath ? relativePath.split(path.sep) : []; }; - diff --git a/packages/bruno-app/src/utils/idb/index.js b/packages/bruno-app/src/utils/idb/index.js index 756efaf1e..8e0666685 100644 --- a/packages/bruno-app/src/utils/idb/index.js +++ b/packages/bruno-app/src/utils/idb/index.js @@ -36,7 +36,7 @@ export const getCollectionsFromIdb = (connection) => { return collectionStore.getAll(); }) .then((collections) => { - if(!Array.isArray(collections)) { + if (!Array.isArray(collections)) { return new Error('IDB Corrupted'); } @@ -44,4 +44,4 @@ export const getCollectionsFromIdb = (connection) => { }) .catch((err) => reject(err)); }); -}; \ No newline at end of file +}; diff --git a/packages/bruno-app/src/utils/idb/workspaces.js b/packages/bruno-app/src/utils/idb/workspaces.js index 72c96d2d1..29be46dbf 100644 --- a/packages/bruno-app/src/utils/idb/workspaces.js +++ b/packages/bruno-app/src/utils/idb/workspaces.js @@ -7,8 +7,8 @@ export const saveWorkspaceToIdb = (connection, workspace) => { let tx = db.transaction(`workspace`, 'readwrite'); let workspaceStore = tx.objectStore('workspace'); - if(isArray(workspace)) { - for(let c of workspace) { + if (isArray(workspace)) { + for (let c of workspace) { workspaceStore.put(c); } } else { @@ -48,7 +48,7 @@ export const getWorkspacesFromIdb = (connection) => { return workspaceStore.getAll(); }) .then((workspaces) => { - if(!Array.isArray(workspaces)) { + if (!Array.isArray(workspaces)) { return new Error('IDB Corrupted'); } @@ -56,4 +56,4 @@ export const getWorkspacesFromIdb = (connection) => { }) .catch((err) => reject(err)); }); -}; \ No newline at end of file +}; diff --git a/packages/bruno-app/src/utils/network/browser.js b/packages/bruno-app/src/utils/network/browser.js index f0f0d55de..d32a328c2 100644 --- a/packages/bruno-app/src/utils/network/browser.js +++ b/packages/bruno-app/src/utils/network/browser.js @@ -3,7 +3,7 @@ import { saveCancelToken, deleteCancelToken } from 'utils/network/cancelTokens'; export const sendHttpRequestInBrowser = async (request, options) => { try { - if(options && options.cancelTokenUid) { + if (options && options.cancelTokenUid) { const cancelToken = axios.CancelToken.source(); request.cancelToken = cancelToken.token; saveCancelToken(options.cancelTokenUid, cancelToken); @@ -11,7 +11,7 @@ export const sendHttpRequestInBrowser = async (request, options) => { const result = await axios(request); - if(options && options.cancelTokenUid) { + if (options && options.cancelTokenUid) { deleteCancelToken(options.cancelTokenUid); } @@ -21,18 +21,18 @@ export const sendHttpRequestInBrowser = async (request, options) => { data: result.data }; } catch (error) { - if(options && options.cancelTokenUid) { + if (options && options.cancelTokenUid) { deleteCancelToken(options.cancelTokenUid); } - if(error.response) { + if (error.response) { return { status: error.response.status, headers: error.response.headers, data: error.response.data - } - }; + }; + } return Promise.reject(error); } -}; \ No newline at end of file +}; diff --git a/packages/bruno-app/src/utils/network/cancelTokens.js b/packages/bruno-app/src/utils/network/cancelTokens.js index e3f1404cb..976bd4726 100644 --- a/packages/bruno-app/src/utils/network/cancelTokens.js +++ b/packages/bruno-app/src/utils/network/cancelTokens.js @@ -7,8 +7,8 @@ export default cancelTokens; export const saveCancelToken = (uid, axiosRequest) => { cancelTokens[uid] = axiosRequest; -} +}; export const deleteCancelToken = (uid) => { delete cancelTokens[uid]; -} \ No newline at end of file +}; diff --git a/packages/bruno-app/src/utils/network/index.js b/packages/bruno-app/src/utils/network/index.js index f57bde475..33f3a3f5f 100644 --- a/packages/bruno-app/src/utils/network/index.js +++ b/packages/bruno-app/src/utils/network/index.js @@ -8,7 +8,7 @@ import cancelTokens, { deleteCancelToken } from 'utils/network/cancelTokens'; export const sendNetworkRequest = async (item, options) => { return new Promise((resolve, reject) => { - if(item.type === 'http-request') { + if (item.type === 'http-request') { const timeStart = Date.now(); sendHttpRequest(item.draft ? item.draft.request : item.request, options) .then((response) => { @@ -17,7 +17,7 @@ export const sendNetworkRequest = async (item, options) => { state: 'success', data: response.data, headers: Object.entries(response.headers), - size: response.headers["content-length"] || 0, + size: response.headers['content-length'] || 0, status: response.status, duration: timeEnd - timeStart }); @@ -33,7 +33,7 @@ const sendHttpRequest = async (request, options) => { const headers = {}; each(request.headers, (h) => { - if(h.enabled) { + if (h.enabled) { headers[h.name] = h.value; } }); @@ -44,7 +44,7 @@ const sendHttpRequest = async (request, options) => { headers: headers }; - if(request.body.mode === 'json') { + if (request.body.mode === 'json') { axiosRequest.headers['content-type'] = 'application/json'; try { axiosRequest.data = JSON.parse(request.body.json); @@ -53,28 +53,28 @@ const sendHttpRequest = async (request, options) => { } } - if(request.body.mode === 'text') { + if (request.body.mode === 'text') { axiosRequest.headers['content-type'] = 'text/plain'; axiosRequest.data = request.body.text; } - if(request.body.mode === 'xml') { + if (request.body.mode === 'xml') { axiosRequest.headers['content-type'] = 'text/xml'; axiosRequest.data = request.body.xml; } - if(request.body.mode === 'formUrlEncoded') { + if (request.body.mode === 'formUrlEncoded') { axiosRequest.headers['content-type'] = 'application/x-www-form-urlencoded'; const params = {}; - const enabledParams = filter(request.body.formUrlEncoded, p => p.enabled); - each(enabledParams, (p) => params[p.name] = p.value); + const enabledParams = filter(request.body.formUrlEncoded, (p) => p.enabled); + each(enabledParams, (p) => (params[p.name] = p.value)); axiosRequest.data = qs.stringify(params); } - if(request.body.mode === 'multipartForm') { + if (request.body.mode === 'multipartForm') { const params = {}; - const enabledParams = filter(request.body.multipartForm, p => p.enabled); - each(enabledParams, (p) => params[p.name] = p.value); + const enabledParams = filter(request.body.multipartForm, (p) => p.enabled); + each(enabledParams, (p) => (params[p.name] = p.value)); axiosRequest.headers['content-type'] = 'multipart/form-data'; axiosRequest.data = params; } @@ -82,21 +82,18 @@ const sendHttpRequest = async (request, options) => { console.log('>>> Sending Request'); console.log(axiosRequest); - if(isElectron()) { - ipcRenderer - .invoke('send-http-request', axiosRequest, options) - .then(resolve) - .catch(reject); + if (isElectron()) { + ipcRenderer.invoke('send-http-request', axiosRequest, options).then(resolve).catch(reject); } else { - sendHttpRequestInBrowser(axiosRequest, options) - .then(resolve) - .catch(reject); + sendHttpRequestInBrowser(axiosRequest, options).then(resolve).catch(reject); } }); }; -const sendGraphqlRequest = async (request,) => { - const query = gql`${request.request.body.graphql.query}`; +const sendGraphqlRequest = async (request) => { + const query = gql` + ${request.request.body.graphql.query} + `; const { data, errors, extensions, headers, status } = await rawRequest(request.request.url, query); @@ -105,26 +102,23 @@ const sendGraphqlRequest = async (request,) => { headers, data, errors - } + }; }; export const cancelNetworkRequest = async (cancelTokenUid) => { - if(isElectron()) { + if (isElectron()) { return new Promise((resolve, reject) => { - ipcRenderer - .invoke('cancel-http-request', cancelTokenUid) - .then(resolve) - .catch(reject); + ipcRenderer.invoke('cancel-http-request', cancelTokenUid).then(resolve).catch(reject); }); } return new Promise((resolve, reject) => { - if(cancelTokenUid && cancelTokens[cancelTokenUid]) { + if (cancelTokenUid && cancelTokens[cancelTokenUid]) { cancelTokens[cancelTokenUid].cancel(); deleteCancelToken(cancelTokenUid); resolve(); } else { - reject(new Error("cancel token not found")); + reject(new Error('cancel token not found')); } }); }; diff --git a/packages/bruno-app/src/utils/url/index.js b/packages/bruno-app/src/utils/url/index.js index a07f9a900..63b6b4fc9 100644 --- a/packages/bruno-app/src/utils/url/index.js +++ b/packages/bruno-app/src/utils/url/index.js @@ -4,15 +4,15 @@ import each from 'lodash/each'; import splitOnFirst from 'split-on-first'; export const parseQueryParams = (query) => { - if(!query || !query.length) { + if (!query || !query.length) { return []; } - let params = query.split("&"); + let params = query.split('&'); let result = []; for (let i = 0; i < params.length; i++) { - let pair = splitOnFirst(params[i], '=');; + let pair = splitOnFirst(params[i], '='); result.push({ name: pair[0], value: pair[1] @@ -23,13 +23,13 @@ export const parseQueryParams = (query) => { }; export const stringifyQueryParams = (params) => { - if(!params || isEmpty(params)) { + if (!params || isEmpty(params)) { return ''; } let queryString = []; each(params, (p) => { - if(!isEmpty(trim(p.name)) && !isEmpty(trim(p.value))) { + if (!isEmpty(trim(p.name)) && !isEmpty(trim(p.value))) { queryString.push(`${p.name}=${p.value}`); } }); diff --git a/packages/bruno-app/src/utils/workspaces/index.js b/packages/bruno-app/src/utils/workspaces/index.js index 3690fb0ef..77f56a036 100644 --- a/packages/bruno-app/src/utils/workspaces/index.js +++ b/packages/bruno-app/src/utils/workspaces/index.js @@ -2,4 +2,4 @@ import find from 'lodash/find'; export const findCollectionInWorkspace = (workspace, collectionUid) => { return find(workspace.collections, (c) => c.uid === collectionUid); -}; \ No newline at end of file +};