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

fix: fix ref access when using v-for on Invite.vue (#2744)

Browse Source 
Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>
This commit is contained in:
Akash K
2022-10-06 16:06:14 +05:30
committed by GitHub
parent 604ef4d004
commit 59ee4babeb
3 changed files with 39 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
packages/hoppscotch-app/src/components/collections/teams/Collection.vue
View File

@@ -8,7 +8,7 @@
@drop="dragging = false"
@dragleave="dragging = false"
@dragend="dragging = false"
@contextmenu.prevent="options.tippy.show()"
@contextmenu.prevent="options!.tippy.show()"
>
<span
class="flex items-center justify-center px-4 cursor-pointer"
@@ -62,7 +62,7 @@
interactive
trigger="click"
theme="popover"
:on-shown="() => tippyActions.focus()"
:on-shown="() => tippyActions!.focus()"
>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -74,11 +74,11 @@
ref="tippyActions"
class="flex flex-col focus:outline-none"
tabindex="0"
@keyup.r="requestAction.$el.click()"
@keyup.n="folderAction.$el.click()"
@keyup.e="edit.$el.click()"
@keyup.delete="deleteAction.$el.click()"
@keyup.x="exportAction.$el.click()"
@keyup.r="requestAction!.$el.click()"
@keyup.n="folderAction!.$el.click()"
@keyup.e="edit!.$el.click()"
@keyup.delete="deleteAction!.$el.click()"
@keyup.x="exportAction!.$el.click()"
@keyup.escape="hide()"
>
<SmartItem
@@ -246,6 +246,8 @@ import { moveRESTTeamRequest } from "~/helpers/backend/mutations/TeamRequest"
import { useColorMode } from "@composables/theming"
import { useI18n } from "@composables/i18n"
import { useToast } from "@composables/toast"
import { TippyComponent } from "vue-tippy"
import SmartItem from "@components/smart/Item.vue"
export default defineComponent({
props: {
@@ -275,13 +277,13 @@ export default defineComponent({
return {
// Template refs
tippyActions: ref<any | null>(null),
options: ref<any | null>(null),
requestAction: ref<any | null>(null),
folderAction: ref<any | null>(null),
edit: ref<any | null>(null),
deleteAction: ref<any | null>(null),
exportAction: ref<any | null>(null),
tippyActions: ref<TippyComponent | null>(null),
options: ref<TippyComponent | null>(null),
requestAction: ref<typeof SmartItem | null>(null),
folderAction: ref<typeof SmartItem | null>(null),
edit: ref<typeof SmartItem | null>(null),
deleteAction: ref<typeof SmartItem | null>(null),
exportAction: ref<typeof SmartItem | null>(null),
exportLoading: ref<boolean>(false),
t,
toast: useToast(),
@@ -332,7 +334,7 @@ export default defineComponent({
this.toast.error(this.t("error.something_went_wrong").toString())
console.log(result.left)
this.exportLoading = false
this.options.tippy().hide()
this.options!.tippy.hide()
return
}
@@ -358,7 +360,7 @@ export default defineComponent({
this.exportLoading = false
this.options.tippy().hide()
this.options!.tippy.hide()
},
editRequest(event: any) {
this.$emit("edit-request", event)

34
packages/hoppscotch-app/src/components/collections/teams/Folder.vue
View File

@@ -8,7 +8,7 @@
@drop="dragging = false"
@dragleave="dragging = false"
@dragend="dragging = false"
@contextmenu.prevent="options.tippy.show()"
@contextmenu.prevent="options!.tippy.show()"
>
<span
class="flex items-center justify-center px-4 cursor-pointer"
@@ -52,7 +52,7 @@
interactive
trigger="click"
theme="popover"
:on-shown="() => tippyActions.focus()"
:on-shown="() => tippyActions!.focus()"
>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -64,11 +64,11 @@
ref="tippyActions"
class="flex flex-col focus:outline-none"
tabindex="0"
@keyup.r="requestAction.$el.click()"
@keyup.n="folderAction.$el.click()"
@keyup.e="edit.$el.click()"
@keyup.delete="deleteAction.$el.click()"
@keyup.x="exportAction.$el.click()"
@keyup.r="requestAction!.$el.click()"
@keyup.n="folderAction!.$el.click()"
@keyup.e="edit!.$el.click()"
@keyup.delete="deleteAction!.$el.click()"
@keyup.x="exportAction!.$el.click()"
@keyup.escape="hide()"
>
<SmartItem
@@ -233,6 +233,8 @@ import { moveRESTTeamRequest } from "~/helpers/backend/mutations/TeamRequest"
import { useI18n } from "@composables/i18n"
import { useToast } from "@composables/toast"
import { useColorMode } from "@composables/theming"
import { TippyComponent } from "vue-tippy"
import SmartItem from "@components/smart/Item.vue"
export default defineComponent({
name: "Folder",
@@ -262,13 +264,13 @@ export default defineComponent({
setup() {
return {
// Template refs
tippyActions: ref<any | null>(null),
options: ref<any | null>(null),
requestAction: ref<any | null>(null),
folderAction: ref<any | null>(null),
edit: ref<any | null>(null),
deleteAction: ref<any | null>(null),
exportAction: ref<any | null>(null),
tippyActions: ref<TippyComponent | null>(null),
options: ref<TippyComponent | null>(null),
requestAction: ref<typeof SmartItem | null>(null),
folderAction: ref<typeof SmartItem | null>(null),
edit: ref<typeof SmartItem | null>(null),
deleteAction: ref<typeof SmartItem | null>(null),
exportAction: ref<typeof SmartItem | null>(null),
exportLoading: ref<boolean>(false),
toast: useToast(),
t: useI18n(),
@@ -317,7 +319,7 @@ export default defineComponent({
this.toast.error(this.t("error.something_went_wrong").toString())
console.log(result.left)
this.exportLoading = false
this.options.tippy().hide()
this.options!.tippy.hide()
return
}
@@ -343,7 +345,7 @@ export default defineComponent({
this.exportLoading = false
this.options.tippy().hide()
this.options!.tippy.hide()
},
toggleShowChildren() {
if (this.$props.saveRequest)

5
packages/hoppscotch-app/src/components/teams/Invite.vue
View File

@@ -143,7 +143,7 @@
interactive
trigger="click"
theme="popover"
:on-shown="() => tippyActions.focus()"
:on-shown="() => tippyActions![index].focus()"
>
<span class="select-wrapper">
<input
@@ -364,6 +364,7 @@ import IconMailCheck from "~icons/lucide/mail-check"
import IconCircleDot from "~icons/lucide/circle-dot"
import IconCircle from "~icons/lucide/circle"
import IconArrowLeft from "~icons/lucide/arrow-left"
import { TippyComponent } from "vue-tippy"
const t = useI18n()
@@ -372,7 +373,7 @@ const toast = useToast()
const colorMode = useColorMode()
// Template refs
const tippyActions = ref<any | null>(null)
const tippyActions = ref<TippyComponent[] | null>(null)
const props = defineProps({
show: Boolean,