From 2179ce6fff78d214344b703c16be625dbf314b81 Mon Sep 17 00:00:00 2001 From: Nivedin <53208152+nivedin@users.noreply.github.com> Date: Tue, 14 Mar 2023 14:01:47 +0530 Subject: [PATCH 1/3] fix: reordering bugs and UX fixes (#2948) --- .../hoppscotch-common/src/components.d.ts | 1 - .../src/components/collections/Collection.vue | 118 ++++++--- .../components/collections/MyCollections.vue | 4 + .../src/components/collections/Request.vue | 127 +++++++--- .../collections/TeamCollections.vue | 3 + .../src/components/collections/index.vue | 229 ++++++++++-------- .../helpers/teams/TeamCollectionAdapter.ts | 24 +- .../src/newstore/collections.ts | 21 +- .../src/newstore/reordering.ts | 46 ++++ 9 files changed, 390 insertions(+), 183 deletions(-) create mode 100644 packages/hoppscotch-common/src/newstore/reordering.ts diff --git a/packages/hoppscotch-common/src/components.d.ts b/packages/hoppscotch-common/src/components.d.ts index 970a9ec0b..40471f3c5 100644 --- a/packages/hoppscotch-common/src/components.d.ts +++ b/packages/hoppscotch-common/src/components.d.ts @@ -89,7 +89,6 @@ declare module '@vue/runtime-core' { HoppSmartSpinner: typeof import('@hoppscotch/ui')['HoppSmartSpinner'] HoppSmartTab: typeof import('@hoppscotch/ui')['HoppSmartTab'] HoppSmartTabs: typeof import('@hoppscotch/ui')['HoppSmartTabs'] - HoppSmartToggle: typeof import('@hoppscotch/ui')['HoppSmartToggle'] HttpAuthorization: typeof import('./components/http/Authorization.vue')['default'] HttpBody: typeof import('./components/http/Body.vue')['default'] HttpBodyParameters: typeof import('./components/http/BodyParameters.vue')['default'] diff --git a/packages/hoppscotch-common/src/components/collections/Collection.vue b/packages/hoppscotch-common/src/components/collections/Collection.vue index 83f87c90c..f368409fd 100644 --- a/packages/hoppscotch-common/src/components/collections/Collection.vue +++ b/packages/hoppscotch-common/src/components/collections/Collection.vue @@ -4,7 +4,7 @@ class="h-1 w-full transition" :class="[ { - 'bg-accentDark': ordering && notSameDestination, + 'bg-accentDark': isReorderable, }, ]" @drop="orderUpdateCollectionEvent" @@ -20,35 +20,43 @@ }" >
- - - - - - - {{ collectionName }} + + + - + + + {{ collectionName }} + + +
, + default: null, + required: true, + }, data: { type: Object as PropType | TeamCollection>, default: () => ({}), @@ -258,6 +276,12 @@ const dragging = ref(false) const ordering = ref(false) const dropItemID = ref("") +const currentReorderingStatus = useReadonlyStream(currentReorderingStatus$, { + type: "collection", + id: "", + parentID: "", +}) + // Used to determine if the collection is being dragged to a different destination // This is used to make the highlight effect work watch( @@ -293,11 +317,52 @@ watch( } ) +const isRequestDragging = computed(() => { + return currentReorderingStatus.value.type === "request" +}) + +const isSameParent = computed(() => { + return currentReorderingStatus.value.parentID === props.parentID +}) + +const isReorderable = computed(() => { + return ( + ordering.value && + notSameDestination.value && + !isRequestDragging.value && + isSameParent.value + ) +}) + const dragStart = ({ dataTransfer }: DragEvent) => { if (dataTransfer) { emit("drag-event", dataTransfer) dropItemID.value = dataTransfer.getData("collectionIndex") dragging.value = !dragging.value + changeCurrentReorderStatus({ + type: "collection", + id: props.id, + parentID: props.parentID, + }) + } +} + +// Trigger the re-ordering event when a collection is dragged over another collection's top section +const handleDragOver = (e: DragEvent) => { + dragging.value = true + if (e.offsetY < 10 && notSameDestination.value) { + ordering.value = true + dragging.value = false + } else { + ordering.value = false + } +} + +const handelDrop = (e: DragEvent) => { + if (ordering.value) { + orderUpdateCollectionEvent(e) + } else { + dropEvent(e) } } @@ -305,8 +370,7 @@ const dropEvent = (e: DragEvent) => { if (e.dataTransfer) { e.stopPropagation() emit("drop-event", e.dataTransfer) - dragging.value = !dragging.value - dropItemID.value = "" + resetDragState() } } @@ -314,8 +378,7 @@ const orderUpdateCollectionEvent = (e: DragEvent) => { if (e.dataTransfer) { e.stopPropagation() emit("update-collection-order", e.dataTransfer) - ordering.value = !ordering.value - dropItemID.value = "" + resetDragState() } } @@ -334,6 +397,5 @@ const isCollLoading = computed(() => { const resetDragState = () => { dragging.value = false ordering.value = false - dropItemID.value = "" } diff --git a/packages/hoppscotch-common/src/components/collections/MyCollections.vue b/packages/hoppscotch-common/src/components/collections/MyCollections.vue index 7c6fdcbce..759b7ad69 100644 --- a/packages/hoppscotch-common/src/components/collections/MyCollections.vue +++ b/packages/hoppscotch-common/src/components/collections/MyCollections.vue @@ -39,6 +39,7 @@
- - - - - {{ request.method }} - - - - - {{ request.name }} + + + + + {{ request.method }} + - + + {{ request.name }} + v-if="isActive" + v-tippy="{ theme: 'tooltip' }" + class="relative h-1.5 w-1.5 flex flex-shrink-0 mx-3" + :title="`${t('collection.request_in_use')}`" + > + + + + - +
, + default: null, + required: true, + }, collectionsType: { type: String as PropType, default: "my-collections", @@ -222,6 +236,12 @@ const duplicate = ref(null) const dragging = ref(false) const ordering = ref(false) +const currentReorderingStatus = useReadonlyStream(currentReorderingStatus$, { + type: "collection", + id: "", + parentID: "", +}) + const requestMethodLabels = { get: "text-green-500", post: "text-yellow-500", @@ -255,13 +275,41 @@ const dragStart = ({ dataTransfer }: DragEvent) => { if (dataTransfer) { emit("drag-request", dataTransfer) dragging.value = !dragging.value + changeCurrentReorderStatus({ + type: "request", + id: props.requestID, + parentID: props.parentID, + }) + } +} + +const isCollectionDragging = computed(() => { + return currentReorderingStatus.value.type === "collection" +}) + +const isSameParent = computed(() => { + return currentReorderingStatus.value.parentID === props.parentID +}) + +const isReorderable = computed(() => { + return ordering.value && !isCollectionDragging.value && isSameParent.value +}) + +// Trigger the re-ordering event when a request is dragged over another request's top section +const handleDragOver = (e: DragEvent) => { + dragging.value = true + if (e.offsetY < 10) { + ordering.value = true + dragging.value = false + } else { + ordering.value = false } } const dropEvent = (e: DragEvent) => { if (e.dataTransfer) { e.stopPropagation() - ordering.value = !ordering.value + resetDragState() emit("update-request-order", e.dataTransfer) } } @@ -273,4 +321,9 @@ const isRequestLoading = computed(() => { return false } }) + +const resetDragState = () => { + dragging.value = false + ordering.value = false +} diff --git a/packages/hoppscotch-common/src/components/collections/TeamCollections.vue b/packages/hoppscotch-common/src/components/collections/TeamCollections.vue index 2b694d7fe..c26e29607 100644 --- a/packages/hoppscotch-common/src/components/collections/TeamCollections.vue +++ b/packages/hoppscotch-common/src/components/collections/TeamCollections.vue @@ -53,6 +53,7 @@ { return filteredCollections }) -const isSelected = computed(() => { - return ({ - collectionIndex, - folderPath, - requestIndex, - collectionID, - folderID, - requestID, - }: { - collectionIndex?: number | undefined - folderPath?: string | undefined - requestIndex?: number | undefined - collectionID?: string | undefined - folderID?: string | undefined - requestID?: string | undefined - }) => { - if (collectionIndex !== undefined) { - return ( - props.picked && - props.picked.pickedType === "my-collection" && - props.picked.collectionIndex === collectionIndex - ) - } else if (requestIndex !== undefined && folderPath !== undefined) { - return ( - props.picked && - props.picked.pickedType === "my-request" && - props.picked.folderPath === folderPath && - props.picked.requestIndex === requestIndex - ) - } else if (folderPath !== undefined) { - return ( - props.picked && - props.picked.pickedType === "my-folder" && - props.picked.folderPath === folderPath - ) - } else if (collectionID !== undefined) { - return ( - props.picked && - props.picked.pickedType === "teams-collection" && - props.picked.collectionID === collectionID - ) - } else if (requestID !== undefined) { - return ( - props.picked && - props.picked.pickedType === "teams-request" && - props.picked.requestID === requestID - ) - } else if (folderID !== undefined) { - return ( - props.picked && - props.picked.pickedType === "teams-folder" && - props.picked.folderID === folderID - ) - } +const isSelected = ({ + collectionIndex, + folderPath, + requestIndex, + collectionID, + folderID, + requestID, +}: { + collectionIndex?: number | undefined + folderPath?: string | undefined + requestIndex?: number | undefined + collectionID?: string | undefined + folderID?: string | undefined + requestID?: string | undefined +}) => { + if (collectionIndex !== undefined) { + return ( + props.picked && + props.picked.pickedType === "my-collection" && + props.picked.collectionIndex === collectionIndex + ) + } else if (requestIndex !== undefined && folderPath !== undefined) { + return ( + props.picked && + props.picked.pickedType === "my-request" && + props.picked.folderPath === folderPath && + props.picked.requestIndex === requestIndex + ) + } else if (folderPath !== undefined) { + return ( + props.picked && + props.picked.pickedType === "my-folder" && + props.picked.folderPath === folderPath + ) + } else if (collectionID !== undefined) { + return ( + props.picked && + props.picked.pickedType === "teams-collection" && + props.picked.collectionID === collectionID + ) + } else if (requestID !== undefined) { + return ( + props.picked && + props.picked.pickedType === "teams-request" && + props.picked.requestID === requestID + ) + } else if (folderID !== undefined) { + return ( + props.picked && + props.picked.pickedType === "teams-folder" && + props.picked.folderID === folderID + ) } -}) +} const modalLoadingState = ref(false) const exportLoading = ref(false) @@ -1023,7 +1021,7 @@ const onRemoveCollection = () => { if (collectionIndex === null) return if ( - isSelected.value({ + isSelected({ collectionIndex, }) ) { @@ -1040,7 +1038,7 @@ const onRemoveCollection = () => { if (!collectionID) return if ( - isSelected.value({ + isSelected({ collectionID, }) ) { @@ -1067,7 +1065,7 @@ const onRemoveFolder = () => { if (!folderPath) return if ( - isSelected.value({ + isSelected({ folderPath, }) ) { @@ -1084,7 +1082,7 @@ const onRemoveFolder = () => { if (!collectionID) return if ( - isSelected.value({ + isSelected({ collectionID, }) ) { @@ -1118,7 +1116,7 @@ const onRemoveRequest = () => { if (folderPath === null || requestIndex === null) return if ( - isSelected.value({ + isSelected({ folderPath, requestIndex, }) @@ -1136,7 +1134,7 @@ const onRemoveRequest = () => { if (!requestID) return if ( - isSelected.value({ + isSelected({ requestID, }) ) { @@ -1342,12 +1340,10 @@ const discardRequestChange = () => { * @param path The path of the request * @returns The index of the request */ -const pathToIndex = computed(() => { - return (path: string) => { - const pathArr = path.split("/") - return parseInt(pathArr[pathArr.length - 1]) - } -}) +const pathToLastIndex = (path: string) => { + const pathArr = path.split("/") + return parseInt(pathArr[pathArr.length - 1]) +} /** * This function is called when the user drops the request inside a collection @@ -1363,7 +1359,7 @@ const dropRequest = (payload: { if (collectionsType.value.type === "my-collections" && folderPath) { moveRESTRequest( folderPath, - pathToIndex.value(requestIndex), + pathToLastIndex(requestIndex), destinationCollectionIndex ) toast.success(`${t("request.moved")}`) @@ -1395,6 +1391,43 @@ const dropRequest = (payload: { } } +/** + * @param path The path of the collection or request + * @returns The index of the collection or request + */ +const pathToIndex = (path: string) => { + const pathArr = path.split("/") + return pathArr +} + +/** + * Used to check if the collection exist as the parent of the childrens + * @param collectionIndexDragged The index of the collection dragged + * @param destinationCollectionIndex The index of the destination collection + * @returns True if the collection exist as the parent of the childrens + */ +const checkIfCollectionIsAParentOfTheChildren = ( + collectionIndexDragged: string, + destinationCollectionIndex: string +) => { + const collectionDraggedPath = pathToIndex(collectionIndexDragged) + const destinationCollectionPath = pathToIndex(destinationCollectionIndex) + + if (collectionDraggedPath.length < destinationCollectionPath.length) { + const slicedDestinationCollectionPath = destinationCollectionPath.slice( + 0, + collectionDraggedPath.length + ) + if (isEqual(slicedDestinationCollectionPath, collectionDraggedPath)) { + return true + } else { + return false + } + } + + return false +} + /** * This function is called when the user moves the collection * to a different collection or folder @@ -1408,6 +1441,15 @@ const dropCollection = (payload: { if (!collectionIndexDragged || !destinationCollectionIndex) return if (collectionIndexDragged === destinationCollectionIndex) return if (collectionsType.value.type === "my-collections") { + if ( + checkIfCollectionIsAParentOfTheChildren( + collectionIndexDragged, + destinationCollectionIndex + ) + ) { + toast.error(`${t("team.parent_coll_move")}`) + return + } moveRESTFolder(collectionIndexDragged, destinationCollectionIndex) draggingToRoot.value = false toast.success(`${t("collection.moved")}`) @@ -1445,12 +1487,10 @@ const dropCollection = (payload: { * @param id - path of the collection * @returns boolean - true if the collection is already in the root */ -const isAlreadyInRoot = computed(() => { - return (id: string) => { - const indexPath = id.split("/").map((i) => parseInt(i)) - return indexPath.length === 1 - } -}) +const isAlreadyInRoot = (id: string) => { + const indexPath = pathToIndex(id) + return indexPath.length === 1 +} /** * This function is called when the user drops the collection @@ -1463,7 +1503,7 @@ const dropToRoot = ({ dataTransfer }: DragEvent) => { if (!collectionIndexDragged) return if (collectionsType.value.type === "my-collections") { // check if the collection is already in the root - if (isAlreadyInRoot.value(collectionIndexDragged)) { + if (isAlreadyInRoot(collectionIndexDragged)) { toast.error(`${t("collection.invalid_root_move")}`) } else { moveRESTFolder(collectionIndexDragged, null) @@ -1506,26 +1546,25 @@ const dropToRoot = ({ dataTransfer }: DragEvent) => { * @param destinationReq - path index of the destination request * @returns boolean - true if the request is being moved to the same parent */ -const isSameSameParent = computed( - () => (draggedReq: string, destinationReq: string) => { - const draggedReqIndex = draggedReq.split("/").map((i) => parseInt(i)) - const destinationReqIndex = destinationReq - .split("/") - .map((i) => parseInt(i)) +const isSameSameParent = (draggedItem: string, destinationItem: string) => { + const draggedItemIndex = pathToIndex(draggedItem) + const destinationItemIndex = pathToIndex(destinationItem) - // length of 1 means the request is in the root - if (draggedReqIndex.length === 1 && destinationReqIndex.length === 1) { - return true - } else if ( - draggedReqIndex[draggedReqIndex.length - 2] === - destinationReqIndex[destinationReqIndex.length - 2] - ) { + // length of 1 means the request is in the root + if (draggedItemIndex.length === 1 && destinationItemIndex.length === 1) { + return true + } else if (draggedItemIndex.length === destinationItemIndex.length) { + const dragedItemParent = draggedItemIndex.slice(0, -1) + const destinationItemParent = destinationItemIndex.slice(0, -1) + if (isEqual(dragedItemParent, destinationItemParent)) { return true } else { return false } + } else { + return false } -) +} /** * This function is called when the user updates the request order in a collection @@ -1553,12 +1592,12 @@ const updateRequestOrder = (payload: { if (dragedRequestIndex === destinationRequestIndex) return if (collectionsType.value.type === "my-collections") { - if (!isSameSameParent.value(dragedRequestIndex, destinationRequestIndex)) { + if (!isSameSameParent(dragedRequestIndex, destinationRequestIndex)) { toast.error(`${t("collection.different_parent")}`) } else { updateRESTRequestOrder( - pathToIndex.value(dragedRequestIndex), - pathToIndex.value(destinationRequestIndex), + pathToLastIndex(dragedRequestIndex), + pathToLastIndex(destinationRequestIndex), destinationCollectionIndex ) toast.success(`${t("request.order_changed")}`) @@ -1608,9 +1647,7 @@ const updateCollectionOrder = (payload: { if (dragedCollectionIndex === destinationCollectionIndex) return if (collectionsType.value.type === "my-collections") { - if ( - !isSameSameParent.value(dragedCollectionIndex, destinationCollectionIndex) - ) { + if (!isSameSameParent(dragedCollectionIndex, destinationCollectionIndex)) { toast.error(`${t("collection.different_parent")}`) } else { updateRESTCollectionOrder( diff --git a/packages/hoppscotch-common/src/helpers/teams/TeamCollectionAdapter.ts b/packages/hoppscotch-common/src/helpers/teams/TeamCollectionAdapter.ts index ee9617d31..aee9af86f 100644 --- a/packages/hoppscotch-common/src/helpers/teams/TeamCollectionAdapter.ts +++ b/packages/hoppscotch-common/src/helpers/teams/TeamCollectionAdapter.ts @@ -547,6 +547,15 @@ export default class NewTeamCollectionAdapter { ) } + private reorderItems = (array: unknown[], from: number, to: number) => { + const item = array.splice(from, 1)[0] + if (from < to) { + array.splice(to - 1, 0, item) + } else { + array.splice(to, 0, item) + } + } + public updateRequestOrder( dragedRequestID: string, destinationRequestID: string, @@ -570,10 +579,7 @@ export default class NewTeamCollectionAdapter { if (requestIndex === -1) return - const request = collection.requests[requestIndex] - - collection.requests.splice(requestIndex, 1) - collection.requests.splice(destinationIndex, 0, request) + this.reorderItems(collection.requests, requestIndex, destinationIndex) this.collections$.next(tree) } @@ -600,10 +606,7 @@ export default class NewTeamCollectionAdapter { // If the collection index is not found, don't update if (collectionIndex === -1) return - const collection = coll.children[collectionIndex] - - coll.children.splice(collectionIndex, 1) - coll.children.splice(destinationIndex, 0, collection) + this.reorderItems(coll.children, collectionIndex, destinationIndex) } else { // If the collection has no parent collection, it is a root collection const collectionIndex = tree.findIndex((coll) => coll.id === collectionID) @@ -615,10 +618,7 @@ export default class NewTeamCollectionAdapter { // If the collection index is not found, don't update if (collectionIndex === -1) return - const collection = tree[collectionIndex] - - tree.splice(collectionIndex, 1) - tree.splice(destinationIndex, 0, collection) + this.reorderItems(tree, collectionIndex, destinationIndex) } this.collections$.next(tree) diff --git a/packages/hoppscotch-common/src/newstore/collections.ts b/packages/hoppscotch-common/src/newstore/collections.ts index bcfe05571..0068e24db 100644 --- a/packages/hoppscotch-common/src/newstore/collections.ts +++ b/packages/hoppscotch-common/src/newstore/collections.ts @@ -45,6 +45,15 @@ function navigateToFolderWithIndexPath( return target !== undefined ? target : null } +function reorderItems(array: unknown[], from: number, to: number) { + const item = array.splice(from, 1)[0] + if (from < to) { + array.splice(to - 1, 0, item) + } else { + array.splice(to, 0, item) + } +} + const restCollectionDispatchers = defineDispatchers({ setCollections( _: RESTCollectionStoreType, @@ -295,18 +304,14 @@ const restCollectionDispatchers = defineDispatchers({ ) if (containingFolder === null) { - const [removed] = newState.splice(folderIndex, 1) - - newState.splice(destinationFolderIndex, 0, removed) + reorderItems(newState, folderIndex, destinationFolderIndex) return { state: newState, } } - const [removed] = containingFolder.folders.splice(folderIndex, 1) - - containingFolder.folders.splice(destinationFolderIndex, 0, removed) + reorderItems(containingFolder.folders, folderIndex, destinationFolderIndex) return { state: newState, @@ -480,9 +485,7 @@ const restCollectionDispatchers = defineDispatchers({ return {} } - const [removed] = targetLocation.requests.splice(requestIndex, 1) - - targetLocation.requests.splice(destinationRequestIndex, 0, removed) + reorderItems(targetLocation.requests, requestIndex, destinationRequestIndex) return { state: newState, diff --git a/packages/hoppscotch-common/src/newstore/reordering.ts b/packages/hoppscotch-common/src/newstore/reordering.ts new file mode 100644 index 000000000..ecf1048d4 --- /dev/null +++ b/packages/hoppscotch-common/src/newstore/reordering.ts @@ -0,0 +1,46 @@ +import { distinctUntilChanged, pluck } from "rxjs" +import DispatchingStore, { defineDispatchers } from "./DispatchingStore" + +type ReorderingItem = + | { type: "collection"; id: string; parentID: string | null } + | { type: "request"; id: string; parentID: string | null } + +type CurrentReorderingState = { + currentReorderingItem: ReorderingItem +} + +const initialState: CurrentReorderingState = { + currentReorderingItem: { + type: "collection", + id: "", + parentID: "", + }, +} + +const dispatchers = defineDispatchers({ + changeCurrentReorderStatus( + _, + { reorderItem }: { reorderItem: ReorderingItem } + ) { + return { + currentReorderingItem: reorderItem, + } + }, +}) + +export const currentReorderStore = new DispatchingStore( + initialState, + dispatchers +) + +export const currentReorderingStatus$ = currentReorderStore.subject$.pipe( + pluck("currentReorderingItem"), + distinctUntilChanged() +) + +export function changeCurrentReorderStatus(reorderItem: ReorderingItem) { + currentReorderStore.dispatch({ + dispatcher: "changeCurrentReorderStatus", + payload: { reorderItem }, + }) +} From 1372681b8768b219f2ad953b3d64b59ae24c8a7d Mon Sep 17 00:00:00 2001 From: Akash K <57758277+amk-dev@users.noreply.github.com> Date: Tue, 14 Mar 2023 14:16:45 +0530 Subject: [PATCH 2/3] refactor: store changes for collections (#2947) --- .../hoppscotch-common/src/newstore/collections.ts | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/packages/hoppscotch-common/src/newstore/collections.ts b/packages/hoppscotch-common/src/newstore/collections.ts index 0068e24db..39c3e0c91 100644 --- a/packages/hoppscotch-common/src/newstore/collections.ts +++ b/packages/hoppscotch-common/src/newstore/collections.ts @@ -31,7 +31,7 @@ const defaultGraphqlCollectionState = { type RESTCollectionStoreType = typeof defaultRESTCollectionState type GraphqlCollectionStoreType = typeof defaultGraphqlCollectionState -function navigateToFolderWithIndexPath( +export function navigateToFolderWithIndexPath( collections: HoppCollection[], indexPaths: number[] ) { @@ -97,12 +97,15 @@ const restCollectionDispatchers = defineDispatchers({ { state }: RESTCollectionStoreType, { collectionIndex, - collection, - }: { collectionIndex: number; collection: HoppCollection } + partialCollection, + }: { + collectionIndex: number + partialCollection: Partial> + } ) { return { state: state.map((col, index) => - index === collectionIndex ? collection : col + index === collectionIndex ? { ...col, ...partialCollection } : col ), } }, @@ -824,13 +827,13 @@ export function getRESTCollection(collectionIndex: number) { export function editRESTCollection( collectionIndex: number, - collection: HoppCollection + partialCollection: Partial> ) { restCollectionStore.dispatch({ dispatcher: "editCollection", payload: { collectionIndex, - collection, + partialCollection: partialCollection, }, }) } From 1583c86c78422bbaed126b77e8c66ed6c6a73480 Mon Sep 17 00:00:00 2001 From: Andrew Bastin Date: Tue, 14 Mar 2023 22:32:28 +0530 Subject: [PATCH 3/3] chore: add dotenv as dev dependency to fix staging issues --- packages/hoppscotch-common/package.json | 3 +- pnpm-lock.yaml | 37 ++++++++++++++----------- 2 files changed, 23 insertions(+), 17 deletions(-) diff --git a/packages/hoppscotch-common/package.json b/packages/hoppscotch-common/package.json index 57e35b399..4263f0dab 100644 --- a/packages/hoppscotch-common/package.json +++ b/packages/hoppscotch-common/package.json @@ -31,9 +31,9 @@ "@codemirror/state": "^6.1.0", "@codemirror/view": "^6.0.2", "@hoppscotch/codemirror-lang-graphql": "workspace:^0.2.0", - "@hoppscotch/ui": "workspace:^0.0.1", "@hoppscotch/data": "workspace:^0.4.4", "@hoppscotch/js-sandbox": "workspace:^2.1.0", + "@hoppscotch/ui": "workspace:^0.0.1", "@hoppscotch/vue-toasted": "^0.1.0", "@lezer/highlight": "^1.0.0", "@sentry/tracing": "^7.13.0", @@ -125,6 +125,7 @@ "@vue/eslint-config-typescript": "^11.0.1", "@vue/runtime-core": "^3.2.39", "cross-env": "^7.0.3", + "dotenv": "^16.0.3", "eslint": "^8.24.0", "eslint-plugin-prettier": "^4.2.1", "eslint-plugin-vue": "^9.5.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 85be2f416..cd8400376 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -153,6 +153,7 @@ importers: axios: ^0.21.4 buffer: ^6.0.3 cross-env: ^7.0.3 + dotenv: ^16.0.3 eslint: ^8.24.0 eslint-plugin-prettier: ^4.2.1 eslint-plugin-vue: ^9.5.1 @@ -328,6 +329,7 @@ importers: '@vue/eslint-config-typescript': 11.0.1_kpxf5iryryrlim2ejhkirkiuey '@vue/runtime-core': 3.2.39 cross-env: 7.0.3 + dotenv: 16.0.3 eslint: 8.24.0 eslint-plugin-prettier: 4.2.1_eslint@8.24.0 eslint-plugin-vue: 9.5.1_eslint@8.24.0 @@ -345,7 +347,7 @@ importers: vite-plugin-inspect: 0.7.4_vite@3.1.4 vite-plugin-pages: 0.26.0_vnheu5mvzzbfbuhqo4shkhdhei vite-plugin-pages-sitemap: 1.4.0 - vite-plugin-pwa: 0.13.1_vite@3.1.4 + vite-plugin-pwa: 0.13.1_bg4cnt4dy3xq3a47wkujd6ryzq vite-plugin-vue-layouts: 0.7.0_oewzdqozxqnqgsrjzmwikx34vi vite-plugin-windicss: 1.8.8_vite@3.1.4 vue-tsc: 0.38.2_typescript@4.7.4 @@ -3215,7 +3217,7 @@ packages: '@types/jsonwebtoken': 8.5.8 chalk: 4.1.2 debug: 4.3.4 - dotenv: 16.0.1 + dotenv: 16.0.3 graphql: 15.8.0 graphql-request: 4.3.0_graphql@15.8.0 http-proxy-agent: 5.0.0 @@ -3515,8 +3517,8 @@ packages: yaml-eslint-parser: 0.3.2 dev: true - /@intlify/bundle-utils/4.0.0_vue-i18n@9.2.2: - resolution: {integrity: sha512-klXrYT9VXyKEXsD6UY3pShg0O5MPC07n0TZ5RrSs5ry6T1eZVolIFGJi9c3qcDrh1qjJxgikRnPBmD7qGDqbjw==} + /@intlify/bundle-utils/5.2.0_vue-i18n@9.2.2: + resolution: {integrity: sha512-rIfoNUTBoZK6IfaEeuoYMQZSuAXhPyZoy+UsdZj+V4eM632ynN1bGt5ttkpGO8xe0c+esfYslgJxBz//bdu4qg==} engines: {node: '>= 12'} peerDependencies: petite-vue-i18n: '*' @@ -3529,6 +3531,8 @@ packages: dependencies: '@intlify/message-compiler': 9.3.0-beta.16 '@intlify/shared': 9.3.0-beta.16 + acorn: 8.8.2 + estree-walker: 2.0.2 jsonc-eslint-parser: 1.4.1 source-map: 0.6.1 vue-i18n: 9.2.2_vue@3.2.37 @@ -3589,7 +3593,7 @@ packages: vue-i18n: optional: true dependencies: - '@intlify/bundle-utils': 4.0.0_vue-i18n@9.2.2 + '@intlify/bundle-utils': 5.2.0_vue-i18n@9.2.2 '@intlify/shared': 9.3.0-beta.16 '@rollup/pluginutils': 4.2.1 debug: 4.3.4 @@ -5725,7 +5729,7 @@ packages: dev: true /after/0.8.2: - resolution: {integrity: sha512-QbJ0NTQ/I9DI3uSJA4cbexiwQeRAfjPScqIbSjUDd9TOrcg6pTkdgziesOqxBMBzit8vFCTwrP27t13vFOORRA==} + resolution: {integrity: sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=} dev: false /agent-base/6.0.2: @@ -6082,7 +6086,7 @@ packages: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} /base64-arraybuffer/0.1.4: - resolution: {integrity: sha512-a1eIFi4R9ySrbiMuyTGx5e92uRH5tQY6kArNcFaKBUleIoLjdjBg7Zxm3Mqm3Kmkf27HLR/1fnxX9q8GQ7Iavg==} + resolution: {integrity: sha1-mBjHngWbE1X5fgQooBfIOOkLqBI=} engines: {node: '>= 0.6.0'} dev: false @@ -6544,7 +6548,7 @@ packages: dev: true /component-bind/1.0.0: - resolution: {integrity: sha512-WZveuKPeKAG9qY+FkYDeADzdHyTYdIboXS59ixDeRJL5ZhxpqUnxSOwop4FQjMsiYm3/Or8cegVbpAHNA7pHxw==} + resolution: {integrity: sha1-AMYIq33Nk4l8AAllGx06jh5zu9E=} dev: false /component-emitter/1.3.0: @@ -6552,7 +6556,7 @@ packages: dev: false /component-inherit/0.0.3: - resolution: {integrity: sha512-w+LhYREhatpVqTESyGFg3NlP6Iu0kEKUHETY9GoZP/pQyW4mHFZuFWRUCIqVPZ36ueVLtoOEZaAqbCF2RDndaA==} + resolution: {integrity: sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM=} dev: false /concat-map/0.0.1: @@ -7027,8 +7031,8 @@ packages: is-obj: 2.0.0 dev: true - /dotenv/16.0.1: - resolution: {integrity: sha512-1K6hR6wtk2FviQ4kEiSjFiH5rpzEVi8WW0x96aztHVMhEspNpc4DVOUTEHtEva5VThQ8IaBX1Pe4gSzpVVUsKQ==} + /dotenv/16.0.3: + resolution: {integrity: sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==} engines: {node: '>=12'} dev: true @@ -8956,7 +8960,7 @@ packages: dev: false /has-cors/1.1.0: - resolution: {integrity: sha512-g5VNKdkFuUuVCP9gYfDJHjK2nqdQJ7aDLTnycnc2+RvsOQbuLdF5pm7vuE5J76SEBIQjs4kQY/BWq74JUmjbXA==} + resolution: {integrity: sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk=} dev: false /has-flag/3.0.0: @@ -9260,7 +9264,7 @@ packages: engines: {node: '>=8'} /indexof/0.0.1: - resolution: {integrity: sha512-i0G7hLJ1z0DE8dsqJa2rycj9dBmNKgXBvotXtZYXakU9oivfB9Uj2ZBC27qqef2U58/ZLwalxa1X/RDCdkHtVg==} + resolution: {integrity: sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10=} dev: false /inflight/1.0.6: @@ -12955,7 +12959,7 @@ packages: dev: true /to-array/0.1.4: - resolution: {integrity: sha512-LhVdShQD/4Mk4zXNroIQZJC+Ap3zgLcDuwEdcmLv9CCO73NWockQDwyUnW/m8VX/EElfL6FcYx7EeutN4HJA6A==} + resolution: {integrity: sha1-F+bBH3PdTz10zaek/zI46a2b+JA=} dev: false /to-fast-properties/2.0.0: @@ -14025,10 +14029,11 @@ packages: - supports-color dev: true - /vite-plugin-pwa/0.13.1_vite@3.1.4: + /vite-plugin-pwa/0.13.1_bg4cnt4dy3xq3a47wkujd6ryzq: resolution: {integrity: sha512-NR3dIa+o2hzlzo4lF4Gu0cYvoMjSw2DdRc6Epw1yjmCqWaGuN86WK9JqZie4arNlE1ZuWT3CLiMdiX5wcmmUmg==} peerDependencies: vite: ^3.1.0 + workbox-window: ^6.5.4 dependencies: debug: 4.3.4 fast-glob: 3.2.11 @@ -15082,7 +15087,7 @@ packages: dev: false /yeast/0.1.2: - resolution: {integrity: sha512-8HFIh676uyGYP6wP13R/j6OJ/1HwJ46snpvzE7aHAN3Ryqh2yX6Xox2B4CUmTwwOIzlG3Bs7ocsP5dZH/R1Qbg==} + resolution: {integrity: sha1-AI4G2AlDIMNy28L47XagymyKxBk=} dev: false /yn/3.1.1: