btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

chore: merge hoppscotch/staging into self-hosted/main

Browse Source
This commit is contained in:
Andrew Bastin
2023-04-05 16:37:44 +05:30
parent 47bfef958b 1d397af674
commit 9bfb965e63
12 changed files with 470 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
packages/hoppscotch-common/src/components/app/Header.vue
View File

@@ -17,27 +17,13 @@
/>
<!-- <AppGitHubStarButton class="mt-1.5 transition" /> -->
</div>
<div class="inline-flex items-center justify-center flex-1 space-x-2">
<AppNavigation v-if="mdAndLarger" />
<div
class="bg-primaryDark max-w-128 text-secondaryLight justify-between cursor-pointer rounded border border-dividerDark hover:border-dividerDark hover:bg-primaryLight hover:text-secondary focus-visible:border-dividerDark focus-visible:bg-primaryLight focus-visible:text-secondary focus:outline-none transition flex flex-1 items-center px-2 py-1.25"
tabindex="0"
@click="invokeAction('modals.search.toggle')"
>
<span class="inline-flex">
<icon-lucide-search class="mr-2 svg-icons" />
{{ t("app.search") }}
</span>
<kbd class="shortcut-key">/</kbd>
</div>
<div class="inline-flex items-center space-x-2">
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
:title="`${
mdAndLarger ? t('support.title') : t('app.options')
} <kbd>?</kbd>`"
:icon="IconHelpCircle"
:title="`${t('app.search')} <kbd>/</kbd>`"
:icon="IconSearch"
class="rounded hover:bg-primaryDark focus-visible:bg-primaryDark"
@click="invokeAction('modals.support.toggle')"
@click="invokeAction('modals.search.toggle')"
/>
<HoppButtonSecondary
v-if="showInstallButton"
@@ -47,8 +33,15 @@
class="rounded hover:bg-primaryDark focus-visible:bg-primaryDark"
@click="installPWA()"
/>
</div>
<div class="inline-flex items-center justify-end flex-1 space-x-2">
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
:title="`${
mdAndLarger ? t('support.title') : t('app.options')
} <kbd>?</kbd>`"
:icon="IconLifeBuoy"
class="rounded hover:bg-primaryDark focus-visible:bg-primaryDark"
@click="invokeAction('modals.support.toggle')"
/>
<div
v-if="currentUser === null"
class="inline-flex items-center space-x-2"
@@ -242,7 +235,8 @@ import IconSettings from "~icons/lucide/settings"
import IconDownload from "~icons/lucide/download"
import IconUploadCloud from "~icons/lucide/upload-cloud"
import IconUserPlus from "~icons/lucide/user-plus"
import IconHelpCircle from "~icons/lucide/help-circle"
import IconLifeBuoy from "~icons/lucide/life-buoy"
import IconSearch from "~icons/lucide/search"
import { breakpointsTailwind, useBreakpoints, useNetwork } from "@vueuse/core"
import { pwaDefferedPrompt, installPWA } from "@modules/pwa"
import { platform } from "~/platform"

33
packages/hoppscotch-common/src/components/app/Navigation.vue
View File

@@ -1,33 +0,0 @@
<template>
<div class="flex items-center justify-between">
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', delay: [500, 20], allowHTML: true }"
:title="`${t(
'action.go_back'
)} <kbd>${getSpecialKey()}</kbd><kbd>←</kbd>`"
:icon="IconArrowLeft"
class="rounded hover:bg-primaryDark focus-visible:bg-primaryDark"
@click="router.go(-1)"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', delay: [500, 20], allowHTML: true }"
:title="`${t(
'action.go_forward'
)} <kbd>${getSpecialKey()}</kbd><kbd>→</kbd>`"
:icon="IconArrowRight"
class="rounded hover:bg-primaryDark focus-visible:bg-primaryDark"
@click="router.go(1)"
/>
</div>
</template>
<script setup lang="ts">
import { useI18n } from "@composables/i18n"
import { useRouter } from "vue-router"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import IconArrowLeft from "~icons/lucide/arrow-left"
import IconArrowRight from "~icons/lucide/arrow-right"
const t = useI18n()
const router = useRouter()
</script>

58
packages/hoppscotch-common/src/components/collections/Collection.vue
View File

@@ -165,6 +165,20 @@
</div>
</div>
</div>
<div
v-if="isLastItem"
class="w-full transition"
:class="[
{
'bg-accentDark': isLastItemReorderable,
'h-1 ': isLastItem,
},
]"
@drop="updateLastItemOrder"
@dragover.prevent="orderingLastItem = true"
@dragleave="orderingLastItem = false"
@dragend="resetDragState"
></div>
</div>
</template>
@@ -249,6 +263,11 @@ const props = defineProps({
default: () => [],
required: false,
},
isLastItem: {
type: Boolean,
default: false,
required: false,
},
})
const emit = defineEmits<{
@@ -262,6 +281,7 @@ const emit = defineEmits<{
(event: "drag-event", payload: DataTransfer): void
(event: "dragging", payload: boolean): void
(event: "update-collection-order", payload: DataTransfer): void
(event: "update-last-collection-order", payload: DataTransfer): void
}>()
const tippyActions = ref<TippyComponent | null>(null)
@@ -274,6 +294,7 @@ const options = ref<TippyComponent | null>(null)
const dragging = ref(false)
const ordering = ref(false)
const orderingLastItem = ref(false)
const dropItemID = ref("")
const currentReorderingStatus = useReadonlyStream(currentReorderingStatus$, {
@@ -333,6 +354,14 @@ const isReorderable = computed(() => {
isSameParent.value
)
})
const isLastItemReorderable = computed(() => {
return (
orderingLastItem.value &&
notSameDestination.value &&
!isRequestDragging.value &&
isSameParent.value
)
})
const dragStart = ({ dataTransfer }: DragEvent) => {
if (dataTransfer) {
@@ -350,17 +379,35 @@ const dragStart = ({ dataTransfer }: DragEvent) => {
// 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) {
if (
e.offsetY < 10 &&
notSameDestination.value &&
!isRequestDragging.value &&
isSameParent.value
) {
ordering.value = true
dragging.value = false
orderingLastItem.value = false
} else if (
e.offsetY > 18 &&
notSameDestination.value &&
!isRequestDragging.value &&
isSameParent.value
) {
orderingLastItem.value = true
dragging.value = false
ordering.value = false
} else {
ordering.value = false
orderingLastItem.value = false
}
}
const handelDrop = (e: DragEvent) => {
if (ordering.value) {
orderUpdateCollectionEvent(e)
} else if (orderingLastItem.value) {
updateLastItemOrder(e)
} else {
dropEvent(e)
}
@@ -382,6 +429,14 @@ const orderUpdateCollectionEvent = (e: DragEvent) => {
}
}
const updateLastItemOrder = (e: DragEvent) => {
if (e.dataTransfer) {
e.stopPropagation()
emit("update-last-collection-order", e.dataTransfer)
resetDragState()
}
}
const notSameDestination = computed(() => {
return dropItemID.value !== props.id
})
@@ -397,5 +452,6 @@ const isCollLoading = computed(() => {
const resetDragState = () => {
dragging.value = false
ordering.value = false
orderingLastItem.value = false
}
</script>

65
packages/hoppscotch-common/src/components/collections/MyCollections.vue
View File

@@ -43,6 +43,7 @@
:data="node.data.data.data"
:collections-type="collectionsType.type"
:is-open="isOpen"
:is-last-item="node.data.isLastItem"
:is-selected="
isSelected({
collectionIndex: parseInt(node.id),
@@ -77,7 +78,18 @@
@remove-collection="emit('remove-collection', node.id)"
@drop-event="dropEvent($event, node.id)"
@drag-event="dragEvent($event, node.id)"
@update-collection-order="updateCollectionOrder($event, node.id)"
@update-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: node.id,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@update-last-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: null,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@dragging="
(isDraging) => highlightChildren(isDraging ? node.id : null)
"
@@ -99,6 +111,7 @@
:data="node.data.data.data"
:collections-type="collectionsType.type"
:is-open="isOpen"
:is-last-item="node.data.isLastItem"
:is-selected="
isSelected({
folderPath: node.id,
@@ -133,7 +146,18 @@
@remove-collection="emit('remove-folder', node.id)"
@drop-event="dropEvent($event, node.id)"
@drag-event="dragEvent($event, node.id)"
@update-collection-order="updateCollectionOrder($event, node.id)"
@update-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: node.id,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@update-last-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: null,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@dragging="
(isDraging) => highlightChildren(isDraging ? node.id : null)
"
@@ -155,6 +179,7 @@
:parent-i-d="node.data.data.parentIndex"
:collections-type="collectionsType.type"
:save-request="saveRequest"
:is-last-item="node.data.isLastItem"
:is-active="
isActiveRequest(
node.data.data.parentIndex,
@@ -209,6 +234,12 @@
requestIndex: node.id,
})
"
@update-last-request-order="
updateRequestOrder($event, {
folderPath: node.data.data.parentIndex,
requestIndex: null,
})
"
/>
</template>
<template #emptyNode="{ node }">
@@ -305,6 +336,7 @@ import { currentActiveTab } from "~/helpers/rest/tab"
export type Collection = {
type: "collections"
isLastItem: boolean
data: {
parentIndex: null
data: HoppCollection<HoppRESTRequest>
@@ -313,6 +345,7 @@ export type Collection = {
type Folder = {
type: "folders"
isLastItem: boolean
data: {
parentIndex: string
data: HoppCollection<HoppRESTRequest>
@@ -321,6 +354,7 @@ type Folder = {
type Requests = {
type: "requests"
isLastItem: boolean
data: {
parentIndex: string
data: HoppRESTRequest
@@ -450,7 +484,7 @@ const emit = defineEmits<{
event: "update-request-order",
payload: {
dragedRequestIndex: string
destinationRequestIndex: string
destinationRequestIndex: string | null
destinationCollectionIndex: string
}
): void
@@ -458,7 +492,10 @@ const emit = defineEmits<{
event: "update-collection-order",
payload: {
dragedCollectionIndex: string
destinationCollectionIndex: string
destinationCollection: {
destinationCollectionIndex: string | null
destinationCollectionParentIndex: string | null
}
}
): void
(event: "select", payload: Picked | null): void
@@ -589,7 +626,7 @@ const updateRequestOrder = (
{
folderPath,
requestIndex,
}: { folderPath: string | null; requestIndex: string }
}: { folderPath: string | null; requestIndex: string | null }
) => {
if (!folderPath) return
const dragedRequestIndex = dataTransfer.getData("requestIndex")
@@ -605,13 +642,16 @@ const updateRequestOrder = (
const updateCollectionOrder = (
dataTransfer: DataTransfer,
destinationCollectionIndex: string
destinationCollection: {
destinationCollectionIndex: string | null
destinationCollectionParentIndex: string | null
}
) => {
const dragedCollectionIndex = dataTransfer.getData("collectionIndex")
emit("update-collection-order", {
dragedCollectionIndex,
destinationCollectionIndex,
destinationCollection,
})
}
@@ -641,6 +681,7 @@ class MyCollectionsAdapter implements SmartTreeAdapter<MyCollectionNode> {
id: index.toString(),
data: {
type: "collections",
isLastItem: index === this.data.value.length - 1,
data: {
parentIndex: null,
data: item,
@@ -662,23 +703,25 @@ class MyCollectionsAdapter implements SmartTreeAdapter<MyCollectionNode> {
if (item) {
const data = [
...item.folders.map((item, index) => ({
...item.folders.map((folder, index) => ({
id: `${id}/${index}`,
data: {
isLastItem: index === item.folders.length - 1,
type: "folders",
data: {
parentIndex: id,
data: item,
data: folder,
},
},
})),
...item.requests.map((item, index) => ({
...item.requests.map((requests, index) => ({
id: `${id}/${index}`,
data: {
isLastItem: index === item.requests.length - 1,
type: "requests",
data: {
parentIndex: id,
data: item,
data: requests,
},
},
})),

70
packages/hoppscotch-common/src/components/collections/Request.vue
View File

@@ -1,13 +1,13 @@
<template>
<div class="flex flex-col">
<div
class="h-1"
class="h-1 w-full transition"
:class="[
{
'bg-accentDark': isReorderable,
},
]"
@drop="dropEvent"
@drop="updateRequestOrder"
@dragover.prevent="ordering = true"
@dragleave="resetDragState"
@dragend="resetDragState"
@@ -15,7 +15,7 @@
<div
class="flex items-stretch group"
:draggable="!hasNoTeamAccess"
@drop="dropEvent"
@drop="handelDrop"
@dragstart="dragStart"
@dragover="handleDragOver($event)"
@dragleave="resetDragState"
@@ -138,6 +138,19 @@
</span>
</div>
</div>
<div
class="w-full transition"
:class="[
{
'bg-accentDark': isLastItemReorderable,
'h-1 ': isLastItem,
},
]"
@drop="handelDrop"
@dragover.prevent="orderingLastItem = true"
@dragleave="resetDragState"
@dragend="resetDragState"
></div>
</div>
</template>
@@ -214,6 +227,11 @@ const props = defineProps({
default: () => [],
required: false,
},
isLastItem: {
type: Boolean,
default: false,
required: false,
},
})
const emit = defineEmits<{
@@ -223,6 +241,7 @@ const emit = defineEmits<{
(event: "select-request"): void
(event: "drag-request", payload: DataTransfer): void
(event: "update-request-order", payload: DataTransfer): void
(event: "update-last-request-order", payload: DataTransfer): void
}>()
const tippyActions = ref<TippyComponent | null>(null)
@@ -233,6 +252,7 @@ const duplicate = ref<HTMLButtonElement | null>(null)
const dragging = ref(false)
const ordering = ref(false)
const orderingLastItem = ref(false)
const currentReorderingStatus = useReadonlyStream(currentReorderingStatus$, {
type: "collection",
@@ -269,6 +289,10 @@ const dragStart = ({ dataTransfer }: DragEvent) => {
}
}
const isSameRequest = computed(() => {
return currentReorderingStatus.value.id === props.requestID
})
const isCollectionDragging = computed(() => {
return currentReorderingStatus.value.type === "collection"
})
@@ -278,7 +302,18 @@ const isSameParent = computed(() => {
})
const isReorderable = computed(() => {
return ordering.value && !isCollectionDragging.value && isSameParent.value
return (
ordering.value &&
!isCollectionDragging.value &&
isSameParent.value &&
!isSameRequest.value
)
})
const isLastItemReorderable = computed(() => {
return (
orderingLastItem.value && isSameParent.value && !isCollectionDragging.value
)
})
// Trigger the re-ordering event when a request is dragged over another request's top section
@@ -287,12 +322,28 @@ const handleDragOver = (e: DragEvent) => {
if (e.offsetY < 10) {
ordering.value = true
dragging.value = false
orderingLastItem.value = false
} else if (e.offsetY > 18) {
orderingLastItem.value = true
dragging.value = false
ordering.value = false
} else {
ordering.value = false
orderingLastItem.value = false
}
}
const dropEvent = (e: DragEvent) => {
const handelDrop = (e: DragEvent) => {
if (ordering.value) {
updateRequestOrder(e)
} else if (orderingLastItem.value) {
updateLastItemOrder(e)
} else {
updateRequestOrder(e)
}
}
const updateRequestOrder = (e: DragEvent) => {
if (e.dataTransfer) {
e.stopPropagation()
resetDragState()
@@ -300,6 +351,14 @@ const dropEvent = (e: DragEvent) => {
}
}
const updateLastItemOrder = (e: DragEvent) => {
if (e.dataTransfer) {
e.stopPropagation()
resetDragState()
emit("update-last-request-order", e.dataTransfer)
}
}
const isRequestLoading = computed(() => {
if (props.requestMoveLoading.length > 0 && props.requestID) {
return props.requestMoveLoading.includes(props.requestID)
@@ -311,5 +370,6 @@ const isRequestLoading = computed(() => {
const resetDragState = () => {
dragging.value = false
ordering.value = false
orderingLastItem.value = false
}
</script>

59
packages/hoppscotch-common/src/components/collections/TeamCollections.vue
View File

@@ -60,6 +60,7 @@
:export-loading="exportLoading"
:has-no-team-access="hasNoTeamAccess"
:collection-move-loading="collectionMoveLoading"
:is-last-item="node.data.isLastItem"
:is-selected="
isSelected({
collectionID: node.id,
@@ -95,7 +96,16 @@
@drop-event="dropEvent($event, node.id)"
@drag-event="dragEvent($event, node.id)"
@update-collection-order="
updateCollectionOrder($event, node.data.data.data.id)
updateCollectionOrder($event, {
destinationCollectionIndex: node.data.data.data.id,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@update-last-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: null,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@dragging="
(isDraging) =>
@@ -122,6 +132,7 @@
:export-loading="exportLoading"
:has-no-team-access="hasNoTeamAccess"
:collection-move-loading="collectionMoveLoading"
:is-last-item="node.data.isLastItem"
:is-selected="
isSelected({
folderID: node.data.data.data.id,
@@ -159,7 +170,16 @@
@drop-event="dropEvent($event, node.data.data.data.id)"
@drag-event="dragEvent($event, node.data.data.data.id)"
@update-collection-order="
updateCollectionOrder($event, node.data.data.data.id)
updateCollectionOrder($event, {
destinationCollectionIndex: node.data.data.data.id,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@update-last-collection-order="
updateCollectionOrder($event, {
destinationCollectionIndex: null,
destinationCollectionParentIndex: node.data.data.parentIndex,
})
"
@dragging="
(isDraging) =>
@@ -186,6 +206,7 @@
:is-active="isActiveRequest(node.data.data.data.id)"
:has-no-team-access="hasNoTeamAccess"
:request-move-loading="requestMoveLoading"
:is-last-item="node.data.isLastItem"
:is-selected="
isSelected({
requestID: node.data.data.data.id,
@@ -231,6 +252,12 @@
requestIndex: node.data.data.data.id,
})
"
@update-last-request-order="
updateRequestOrder($event, {
folderPath: node.data.data.parentIndex,
requestIndex: null,
})
"
/>
</template>
<template #emptyNode="{ node }">
@@ -461,7 +488,7 @@ const emit = defineEmits<{
event: "update-request-order",
payload: {
dragedRequestIndex: string
destinationRequestIndex: string
destinationRequestIndex: string | null
destinationCollectionIndex: string
}
): void
@@ -469,7 +496,10 @@ const emit = defineEmits<{
event: "update-collection-order",
payload: {
dragedCollectionIndex: string
destinationCollectionIndex: string
destinationCollection: {
destinationCollectionIndex: string | null
destinationCollectionParentIndex: string | null
}
}
): void
(event: "select", payload: Picked | null): void
@@ -597,7 +627,7 @@ const updateRequestOrder = (
{
folderPath,
requestIndex,
}: { folderPath: string | null; requestIndex: string }
}: { folderPath: string | null; requestIndex: string | null }
) => {
if (!folderPath) return
const dragedRequestIndex = dataTransfer.getData("requestIndex")
@@ -613,17 +643,21 @@ const updateRequestOrder = (
const updateCollectionOrder = (
dataTransfer: DataTransfer,
destinationCollectionIndex: string
destinationCollection: {
destinationCollectionIndex: string | null
destinationCollectionParentIndex: string | null
}
) => {
const dragedCollectionIndex = dataTransfer.getData("collectionIndex")
emit("update-collection-order", {
dragedCollectionIndex,
destinationCollectionIndex,
destinationCollection,
})
}
type TeamCollections = {
isLastItem: boolean
type: "collections"
data: {
parentIndex: null
@@ -632,6 +666,7 @@ type TeamCollections = {
}
type TeamFolder = {
isLastItem: boolean
type: "folders"
data: {
parentIndex: string
@@ -640,6 +675,7 @@ type TeamFolder = {
}
type TeamRequests = {
isLastItem: boolean
type: "requests"
data: {
parentIndex: string
@@ -679,9 +715,10 @@ class TeamCollectionsAdapter implements SmartTreeAdapter<TeamCollectionNode> {
status: "loading",
}
} else {
const data = this.data.value.map((item) => ({
const data = this.data.value.map((item, index) => ({
id: item.id,
data: {
isLastItem: index === this.data.value.length - 1,
type: "collections",
data: {
parentIndex: null,
@@ -709,9 +746,10 @@ class TeamCollectionsAdapter implements SmartTreeAdapter<TeamCollectionNode> {
if (items) {
const data = [
...(items.children
? items.children.map((item) => ({
? items.children.map((item, index) => ({
id: `${id}/${item.id}`,
data: {
isLastItem: index === items.children.length - 1,
type: "folders",
data: {
parentIndex: parsedID,
@@ -721,9 +759,10 @@ class TeamCollectionsAdapter implements SmartTreeAdapter<TeamCollectionNode> {
}))
: []),
...(items.requests
? items.requests.map((item) => ({
? items.requests.map((item, index) => ({
id: `${id}/${item.id}`,
data: {
isLastItem: index === items.requests.length - 1,
type: "requests",
data: {
parentIndex: parsedID,

112
packages/hoppscotch-common/src/components/collections/index.vue
View File

@@ -2,7 +2,8 @@
<div
:class="{
'rounded border border-divider': saveRequest,
'bg-primaryDark': draggingToRoot,
'bg-primaryDark':
draggingToRoot && currentReorderingStatus.type !== 'request',
}"
class="flex-1"
@drop.prevent="dropToRoot"
@@ -85,7 +86,9 @@
/>
<div
class="hidden bg-primaryDark flex-col flex-1 items-center py-15 justify-center px-4 text-secondaryLight"
:class="{ '!flex': draggingToRoot }"
:class="{
'!flex': draggingToRoot && currentReorderingStatus.type !== 'request',
}"
>
<component :is="IconListEnd" class="svg-icons !w-8 !h-8" />
</div>
@@ -232,6 +235,7 @@ import {
resolveSaveContextOnCollectionReorder,
updateSaveContextForAffectedRequests,
} from "~/helpers/collection/collection"
import { currentReorderingStatus$ } from "~/newstore/reordering"
const t = useI18n()
const toast = useToast()
@@ -396,6 +400,12 @@ watch(
}
)
const currentReorderingStatus = useReadonlyStream(currentReorderingStatus$, {
type: "collection",
id: "",
parentID: "",
})
const hasTeamWriteAccess = computed(() => {
if (!collectionsType.value.selectedTeam) return false
@@ -1525,27 +1535,49 @@ const dropToRoot = ({ dataTransfer }: DragEvent) => {
/**
* Used to check if the request/collection is being moved to the same parent since reorder is only allowed within the same parent
* @param draggedReq - path index of the dragged request
* @param destinationReq - path index of the destination request
* @param draggedItem - path index of the dragged request
* @param destinationItem - path index of the destination request
* @param destinationCollectionIndex - index of the destination collection
* @returns boolean - true if the request is being moved to the same parent
*/
const isSameSameParent = (draggedItem: string, destinationItem: string) => {
const draggedItemIndex = pathToIndex(draggedItem)
const destinationItemIndex = pathToIndex(destinationItem)
const isSameSameParent = (
draggedItemPath: string,
destinationItemPath: string | null,
destinationCollectionIndex: string | null
) => {
const draggedItemIndex = pathToIndex(draggedItemPath)
// 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) {
// if the destinationItemPath and destinationCollectionIndex is null, it means the request is being moved to the root
if (destinationItemPath === null && destinationCollectionIndex === null) {
return draggedItemIndex.length === 1
} else if (
destinationItemPath === null &&
destinationCollectionIndex !== null &&
draggedItemIndex.length === 1
) {
return draggedItemIndex[0] === destinationCollectionIndex
} else if (destinationItemPath === null && draggedItemIndex.length !== 1) {
const dragedItemParent = draggedItemIndex.slice(0, -1)
const destinationItemParent = destinationItemIndex.slice(0, -1)
if (isEqual(dragedItemParent, destinationItemParent)) {
return dragedItemParent[0] === destinationCollectionIndex
} else {
if (destinationItemPath === null) return false
const destinationItemIndex = pathToIndex(destinationItemPath)
// 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
}
} else {
return false
}
}
@@ -1556,7 +1588,7 @@ const isSameSameParent = (draggedItem: string, destinationItem: string) => {
*/
const updateRequestOrder = (payload: {
dragedRequestIndex: string
destinationRequestIndex: string
destinationRequestIndex: string | null
destinationCollectionIndex: string
}) => {
const {
@@ -1565,29 +1597,28 @@ const updateRequestOrder = (payload: {
destinationCollectionIndex,
} = payload
if (
!dragedRequestIndex ||
!destinationRequestIndex ||
!destinationCollectionIndex
)
return
if (!dragedRequestIndex || !destinationCollectionIndex) return
if (dragedRequestIndex === destinationRequestIndex) return
if (collectionsType.value.type === "my-collections") {
if (!isSameSameParent(dragedRequestIndex, destinationRequestIndex)) {
if (
!isSameSameParent(
dragedRequestIndex,
destinationRequestIndex,
destinationCollectionIndex
)
) {
toast.error(`${t("collection.different_parent")}`)
} else {
updateRESTRequestOrder(
pathToLastIndex(dragedRequestIndex),
pathToLastIndex(destinationRequestIndex),
destinationRequestIndex
? pathToLastIndex(destinationRequestIndex)
: null,
destinationCollectionIndex
)
resolveSaveContextOnRequestReorder({
lastIndex: pathToLastIndex(dragedRequestIndex),
newIndex: pathToLastIndex(destinationRequestIndex),
folderPath: destinationCollectionIndex,
})
toast.success(`${t("request.order_changed")}`)
}
} else if (hasTeamWriteAccess.value) {
@@ -1628,14 +1659,25 @@ const updateRequestOrder = (payload: {
*/
const updateCollectionOrder = (payload: {
dragedCollectionIndex: string
destinationCollectionIndex: string
destinationCollection: {
destinationCollectionIndex: string | null
destinationCollectionParentIndex: string | null
}
}) => {
const { dragedCollectionIndex, destinationCollectionIndex } = payload
if (!dragedCollectionIndex || !destinationCollectionIndex) return
const { dragedCollectionIndex, destinationCollection } = payload
const { destinationCollectionIndex, destinationCollectionParentIndex } =
destinationCollection
if (!dragedCollectionIndex) return
if (dragedCollectionIndex === destinationCollectionIndex) return
if (collectionsType.value.type === "my-collections") {
if (!isSameSameParent(dragedCollectionIndex, destinationCollectionIndex)) {
if (
!isSameSameParent(
dragedCollectionIndex,
destinationCollectionIndex,
destinationCollectionParentIndex
)
) {
toast.error(`${t("collection.different_parent")}`)
} else {
updateRESTCollectionOrder(
@@ -1644,7 +1686,9 @@ const updateCollectionOrder = (payload: {
)
resolveSaveContextOnCollectionReorder({
lastIndex: pathToLastIndex(dragedCollectionIndex),
newIndex: pathToLastIndex(destinationCollectionIndex),
newIndex: pathToLastIndex(
destinationCollectionIndex ? destinationCollectionIndex : ""
),
folderPath: dragedCollectionIndex.split("/").slice(0, -1).join("/"),
})
toast.success(`${t("collection.order_changed")}`)