feat: refactored import collection

This commit is contained in:
Anoop M D 2022-10-30 00:09:24 +05:30
parent c3fa473dae
commit bf4c26de33
8 changed files with 68 additions and 34 deletions

1
.gitignore vendored
View File

@ -17,6 +17,7 @@ chrome-extension
chrome-extension.pem
chrome-extension.crx
bruno.zip
*.zip
# misc
.DS_Store

View File

@ -144,6 +144,13 @@ const Wrapper = styled.div`
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}
&.modal-footer-none {
.bruno-modal-content {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
}
`;
export default Wrapper;

View File

@ -64,6 +64,9 @@ const Modal = ({ size, title, confirmText, cancelText, handleCancel, handleConfi
if (isClosing) {
classes += ' modal--animate-out';
}
if(hideFooter) {
classes += ' modal-footer-none';
}
return (
<StyledWrapper className={classes}>
<div className={`bruno-modal-card modal-${size}`}>

View File

@ -0,0 +1,40 @@
import React from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { collectionImported } from 'providers/ReduxStore/slices/collections';
import importBrunoCollection from 'utils/importers/bruno-collection';
import { addCollectionToWorkspace } from 'providers/ReduxStore/slices/workspaces/actions';
import { toastError } from 'utils/common/error';
import toast from 'react-hot-toast';
import Modal from 'components/Modal';
const ImportCollection = ({ onClose }) => {
const dispatch = useDispatch();
const { activeWorkspaceUid } = useSelector((state) => state.workspaces);
const handleImportBrunoCollection = () => {
importBrunoCollection()
.then((collection) => {
dispatch(collectionImported({ collection: collection }));
dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid));
toast.success('Collection imported successfully');
onClose();
})
.catch((err) => toastError(err, 'Import collection failed'));
};
return (
<Modal size="sm" title="Import Collection" hideFooter={true} handleConfirm={onClose} handleCancel={onClose}>
<div>
<div
className='text-link hover:underline cursor-pointer'
onClick={handleImportBrunoCollection}
>
Bruno Collection
</div>
<div className='text-link hover:underline cursor-pointer mt-2'>Postman Collection</div>
</div>
</Modal>
);
};
export default ImportCollection;

View File

@ -2,8 +2,8 @@ import toast from 'react-hot-toast';
import Bruno from 'components/Bruno';
import Dropdown from 'components/Dropdown';
import CreateCollection from '../CreateCollection';
import importCollection from 'utils/collections/import';
import SelectCollection from 'components/Sidebar/Collections/SelectCollection';
import ImportCollection from 'components/Sidebar/ImportCollection';
import { IconDots } from '@tabler/icons';
import { IconFolders } from '@tabler/icons';
@ -11,13 +11,13 @@ import { isElectron } from 'utils/common/platform';
import { useState, forwardRef, useRef } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { showHomePage } from 'providers/ReduxStore/slices/app';
import { collectionImported } from 'providers/ReduxStore/slices/collections';
import { openLocalCollection } from 'providers/ReduxStore/slices/collections/actions';
import { addCollectionToWorkspace } from 'providers/ReduxStore/slices/workspaces/actions';
import StyledWrapper from './StyledWrapper';
const TitleBar = () => {
const [createCollectionModalOpen, setCreateCollectionModalOpen] = useState(false);
const [importCollectionModalOpen, setImportCollectionModalOpen] = useState(false);
const [addCollectionToWSModalOpen, setAddCollectionToWSModalOpen] = useState(false);
const { activeWorkspaceUid } = useSelector((state) => state.workspaces);
const isPlatformElectron = isElectron();
@ -48,18 +48,10 @@ const TitleBar = () => {
.catch(() => toast.error('An error occured while adding collection to workspace'));
};
const handleImportCollection = () => {
importCollection()
.then((collection) => {
dispatch(collectionImported({ collection: collection }));
dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid));
})
.catch((err) => console.log(err));
};
return (
<StyledWrapper className="px-2 py-2">
{createCollectionModalOpen ? <CreateCollection isLocal={createCollectionModalOpen === 'local' ? true : false} onClose={() => setCreateCollectionModalOpen(false)} /> : null}
{importCollectionModalOpen ? <ImportCollection onClose={() => setImportCollectionModalOpen(false)} /> : null}
{addCollectionToWSModalOpen ? (
<SelectCollection title="Add Collection to Workspace" onClose={() => setAddCollectionToWSModalOpen(false)} onSelect={handleAddCollectionToWorkspace} />
@ -91,7 +83,7 @@ const TitleBar = () => {
className="dropdown-item"
onClick={(e) => {
menuDropdownTippyRef.current.hide();
handleImportCollection();
setImportCollectionModalOpen(true);
}}
>
Import Collection

View File

@ -10,13 +10,15 @@ import { IconBrandGithub, IconPlus, IconUpload, IconFiles, IconFolders, IconPlay
import Bruno from 'components/Bruno';
import CreateCollection from 'components/Sidebar/CreateCollection';
import SelectCollection from 'components/Sidebar/Collections/SelectCollection';
import importCollection, { importSampleCollection } from 'utils/collections/import';
import { importSampleCollection } from 'utils/importers/bruno-collection';
import ImportCollection from 'components/Sidebar/ImportCollection';
import StyledWrapper from './StyledWrapper';
const Welcome = () => {
const dispatch = useDispatch();
const [createCollectionModalOpen, setCreateCollectionModalOpen] = useState(false);
const [addCollectionToWSModalOpen, setAddCollectionToWSModalOpen] = useState(false);
const [importCollectionModalOpen, setImportCollectionModalOpen] = useState(false);
const { activeWorkspaceUid } = useSelector((state) => state.workspaces);
const isPlatformElectron = isElectron();
@ -29,15 +31,6 @@ const Welcome = () => {
.catch(() => toast.error('An error occured while adding collection to workspace'));
};
const handleImportCollection = () => {
importCollection()
.then((collection) => {
dispatch(collectionImported({ collection: collection }));
dispatch(addCollectionToWorkspace(activeWorkspaceUid, collection.uid));
})
.catch((err) => console.log(err));
};
const handleImportSampleCollection = () => {
importSampleCollection()
.then((collection) => {
@ -58,6 +51,7 @@ const Welcome = () => {
return (
<StyledWrapper className="pb-4 px-6 mt-6">
{createCollectionModalOpen ? <CreateCollection isLocal={createCollectionModalOpen === 'local' ? true : false} onClose={() => setCreateCollectionModalOpen(false)} /> : null}
{importCollectionModalOpen ? <ImportCollection onClose={() => setImportCollectionModalOpen(false)} /> : null}
{addCollectionToWSModalOpen ? (
<SelectCollection title="Add Collection to Workspace" onClose={() => setAddCollectionToWSModalOpen(false)} onSelect={handleAddCollectionToWorkspace} />
@ -83,7 +77,7 @@ const Welcome = () => {
Add Collection to Workspace
</span>
</div>
<div className="flex items-center ml-6" onClick={handleImportCollection}>
<div className="flex items-center ml-6" onClick={() => setImportCollectionModalOpen(true)}>
<IconUpload size={18} strokeWidth={2} />
<span className="label ml-2" id="import-collection">Import Collection</span>
</div>

View File

@ -1,11 +1,11 @@
import each from 'lodash/each';
import get from 'lodash/get';
import fileDialog from 'file-dialog';
import toast from 'react-hot-toast';
import cloneDeep from 'lodash/cloneDeep';
import { uuid } from 'utils/common';
import { collectionSchema } from '@usebruno/schema';
import { saveCollectionToIdb } from 'utils/idb';
import { BrunoError } from 'utils/common/error';
import sampleCollection from './samples/sample-collection.json';
const readFile = (files) => {
@ -23,8 +23,8 @@ const parseJsonCollection = (str) => {
let parsed = JSON.parse(str);
return resolve(parsed);
} catch (err) {
toast.error('Unable to parse the collection json file');
reject(err);
console.log(err);
reject(new BrunoError('Unable to parse the collection json file'));
}
});
};
@ -35,8 +35,8 @@ const validateSchema = (collection = {}) => {
.validate(collection)
.then(() => resolve(collection))
.catch((err) => {
toast.error('The Collection file is corrupted');
reject(err);
console.log(err);
reject(new BrunoError('The Collection file is corrupted'));
});
});
};
@ -74,13 +74,10 @@ const importCollection = () => {
.then(updateUidsInCollection)
.then(validateSchema)
.then((collection) => saveCollectionToIdb(window.__idb, collection))
.then((collection) => {
toast.success('Collection imported successfully');
resolve(collection);
})
.then((collection) => resolve(collection))
.catch((err) => {
toast.error('Import collection failed');
reject(err);
console.log(err);
reject(new BrunoError('Import collection failed'));
});
});
};