From 8a1cdd27d50b2ba4d9842f945e0a49a64f124c68 Mon Sep 17 00:00:00 2001
From: wvffle <funkwhale@wvffle.net>
Date: Wed, 2 Nov 2022 13:53:44 +0000
Subject: [PATCH] Fix request/reports not filtering and form auto focussing on
 mounted when `autofocus` is `false`

---
 front/src/components/common/ContentForm.vue       | 13 +++++++------
 front/src/router/routes/manage.ts                 |  2 ++
 front/src/views/admin/moderation/ReportsList.vue  |  4 +++-
 front/src/views/admin/moderation/RequestsList.vue |  4 +++-
 4 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/front/src/components/common/ContentForm.vue b/front/src/components/common/ContentForm.vue
index 998da5600..a25306542 100644
--- a/front/src/components/common/ContentForm.vue
+++ b/front/src/components/common/ContentForm.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import axios from 'axios'
 import { useVModel, watchDebounced, useTextareaAutosize, syncRef } from '@vueuse/core'
-import { ref, computed, watchEffect, onMounted, nextTick } from 'vue'
+import { ref, computed, watchEffect, onMounted, nextTick, watch } from 'vue'
 import { useGettext } from 'vue3-gettext'
 
 interface Events {
@@ -61,14 +61,15 @@ watchEffect(async () => {
     if (value.value && !preview.value && !isLoadingPreview.value) {
       await loadPreview()
     }
-
-    return
   }
-
-  await nextTick()
-  textarea.value.focus()
 })
 
+watch(isPreviewing, (to, from) => {
+  if (from === true) {
+    textarea.value.focus()
+  }
+}, { flush: 'post' })
+
 onMounted(async () => {
   if (props.autofocus) {
     await nextTick()
diff --git a/front/src/router/routes/manage.ts b/front/src/router/routes/manage.ts
index b0aecf468..e315c6845 100644
--- a/front/src/router/routes/manage.ts
+++ b/front/src/router/routes/manage.ts
@@ -157,6 +157,7 @@ export default [
         path: 'reports',
         name: 'manage.moderation.reports.list',
         component: () => import('~/views/admin/moderation/ReportsList.vue'),
+        props: route => ({ defaultQuery: route.query.q }),
         meta: {
           paginateBy: 25
         }
@@ -171,6 +172,7 @@ export default [
         path: 'requests',
         name: 'manage.moderation.requests.list',
         component: () => import('~/views/admin/moderation/RequestsList.vue'),
+        props: route => ({ defaultQuery: route.query.q }),
         meta: {
           paginateBy: 25
         }
diff --git a/front/src/views/admin/moderation/ReportsList.vue b/front/src/views/admin/moderation/ReportsList.vue
index 4d80320a3..5baf6087c 100644
--- a/front/src/views/admin/moderation/ReportsList.vue
+++ b/front/src/views/admin/moderation/ReportsList.vue
@@ -25,11 +25,13 @@ interface Props extends SmartSearchProps, OrderingProps {
   mode?: 'card'
 
   // TODO(wvffle): Remove after https://github.com/vuejs/core/pull/4512 is merged
+  defaultQuery?: string
   orderingConfigName?: RouteRecordName
   updateUrl?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  defaultQuery: '',
   updateUrl: false,
   mode: 'card',
   orderingConfigName: undefined
@@ -81,7 +83,7 @@ const fetchData = async () => {
 }
 
 onSearch(() => (page.value = 1))
-watch(page, fetchData)
+watch([page, query], fetchData)
 onOrderingUpdate(fetchData)
 fetchData()
 
diff --git a/front/src/views/admin/moderation/RequestsList.vue b/front/src/views/admin/moderation/RequestsList.vue
index a331802ca..8bae4e96e 100644
--- a/front/src/views/admin/moderation/RequestsList.vue
+++ b/front/src/views/admin/moderation/RequestsList.vue
@@ -22,11 +22,13 @@ import usePage from '~/composables/navigation/usePage'
 
 interface Props extends SmartSearchProps, OrderingProps {
   // TODO(wvffle): Remove after https://github.com/vuejs/core/pull/4512 is merged
+  defaultQuery?: string
   orderingConfigName?: RouteRecordName
   updateUrl?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  defaultQuery: '',
   updateUrl: false,
   orderingConfigName: undefined
 })
@@ -77,7 +79,7 @@ const fetchData = async () => {
 }
 
 onSearch(() => (page.value = 1))
-watch(page, fetchData)
+watch([page, query], fetchData)
 onOrderingUpdate(fetchData)
 fetchData()