검색 동선 통일

frontend/src/views/FollowingFeedView.vue

@@ -12,7 +12,7 @@ const route = useRoute()
 const toast = useToast()
 
 const tierLists = ref([])
-const query = ref('')
+const query = computed(() => (typeof route.query.q === 'string' ? route.query.q.trim() : ''))
 const isLoading = ref(false)
 const error = ref('')
 const brokenThumbnailIds = ref({})
@@ -78,6 +78,7 @@ function openAuthorProfile(tierList) {
 }
 
 onMounted(loadFollowingFeed)
+watch(query, loadFollowingFeed)
 </script>
 
 <template>
@@ -88,10 +89,6 @@ onMounted(loadFollowingFeed)
         <h2 class="pageHead__title">팔로우 피드</h2>
         <div class="pageHead__desc">팔로우한 작성자가 공개한 티어표를 최신 업데이트순으로 모아봅니다.</div>
       </div>
-      <div class="pageHead__aside toolbar">
-        <input v-model="query" class="input" placeholder="제목, 주제, 작성자 검색" @keydown.enter.prevent="loadFollowingFeed" />
-        <button class="btn" :disabled="isLoading" @click="loadFollowingFeed">{{ isLoading ? '검색중...' : '검색' }}</button>
-      </div>
     </section>
 
     <section class="panel">
@@ -146,28 +143,6 @@ onMounted(loadFollowingFeed)
   border-radius: 0;
   padding: 0;
 }
-.toolbar {
-  display: flex;
-  gap: 10px;
-  flex-wrap: wrap;
-}
-.input {
-  min-width: 240px;
-  padding: 11px 13px;
-  border-radius: 14px;
-  border: 1px solid var(--theme-border);
-  background: var(--theme-surface-soft);
-  color: var(--theme-text);
-}
-.btn {
-  padding: 11px 13px;
-  border-radius: 14px;
-  border: 1px solid var(--theme-border);
-  background: var(--theme-surface-soft-2);
-  color: var(--theme-text);
-  font-weight: 800;
-  cursor: pointer;
-}
 .empty {
   opacity: 0.75;
 }
@@ -352,9 +327,5 @@ onMounted(loadFollowingFeed)
     padding: 16px 18px 0;
   }
 
-  .input {
-    min-width: 0;
-    width: 100%;
-  }
 }
 </style>