feat: add skip button to queued posts and display version in header

- Add skip button to QueuedPostCard for dismissing posts before AI analysis
- Skipped queued posts appear in Skipped tab with "Pre-Skipped" badge
- Add skippedBeforeAnalysis flag to MatchedPostWithScore type
- Add SKIP_QUEUED_POST message and handler in background service worker
- Display extension version next to ReplyQueue title in header

Author: charlesjones-dev

src/background/index.ts

@@ -30,6 +30,7 @@ import {
   isCachedFeedValid,
   addEvaluatedPostIds,
   getEvaluatedPostIds,
+  skipQueuedPost,
 } from '../shared/storage';
 import {
   DEFAULT_MATCHING_PREFERENCES,
@@ -744,6 +745,28 @@ async function handleRequestHostPermission(message: ExtensionMessage): Promise<M
   }
 }
 
+/**
+ * Handle SKIP_QUEUED_POST message
+ * Skips a queued post before AI analysis
+ */
+async function handleSkipQueuedPost(message: ExtensionMessage): Promise<MessageResponse> {
+  const { postId, platform } = message as { postId: string; platform: string };
+
+  if (!postId || !platform) {
+    return { success: false, error: 'Post ID and platform are required' };
+  }
+
+  try {
+    await skipQueuedPost(postId, platform);
+    console.log(`${LOG_PREFIX} Skipped queued post ${postId} from ${platform}`);
+    return { success: true };
+  } catch (error) {
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    console.error(`${LOG_PREFIX} Error skipping queued post:`, error);
+    return { success: false, error: errorMessage };
+  }
+}
+
 /**
  * Main message handler
  */
@@ -805,6 +828,9 @@ chrome.runtime.onMessage.addListener(
         case 'HEAT_CHECK_POSTS':
           return handleHeatCheckPosts();
 
+        case 'SKIP_QUEUED_POST':
+          return handleSkipQueuedPost(message);
+
         case 'CHECK_HOST_PERMISSION':
           return handleCheckHostPermission(message);
 

src/shared/messages.ts

@@ -27,6 +27,8 @@ export type MessageType =
   | 'GENERATE_SUGGESTIONS'
   | 'REGENERATE_SUGGESTIONS'
   | 'HEAT_CHECK_POSTS'
+  // Queue management
+  | 'SKIP_QUEUED_POST'
   // Permission messages
   | 'REQUEST_HOST_PERMISSION'
   | 'CHECK_HOST_PERMISSION';
@@ -175,6 +177,19 @@ export interface HeatCheckPostsMessage extends BaseMessage {
   type: 'HEAT_CHECK_POSTS';
 }
 
+// ============================================================
+// Queue management messages
+// ============================================================
+
+/**
+ * Skip a queued post before AI analysis
+ */
+export interface SkipQueuedPostMessage extends BaseMessage {
+  type: 'SKIP_QUEUED_POST';
+  postId: string;
+  platform: string;
+}
+
 // ============================================================
 // Permission messages
 // ============================================================
@@ -218,6 +233,7 @@ export type ExtensionMessage =
   | GenerateSuggestionsMessage
   | RegenerateSuggestionsMessage
   | HeatCheckPostsMessage
+  | SkipQueuedPostMessage
   | RequestHostPermissionMessage
   | CheckHostPermissionMessage;
 

src/shared/storage.ts

@@ -605,6 +605,44 @@ export async function clearExampleComments(): Promise<void> {
   }
 }
 
+// ============================================================
+// Skip queued post (before AI analysis)
+// ============================================================
+
+/**
+ * Skip a queued post before AI analysis
+ * Creates a synthetic MatchedPostWithScore with status 'skipped' and skippedBeforeAnalysis flag
+ */
+export async function skipQueuedPost(postId: string, platform: string): Promise<void> {
+  // Find post in extractedPosts
+  const extractedPosts = await getExtractedPosts();
+  const post = extractedPosts.find((p) => p.id === postId && p.platform === platform);
+
+  if (!post) {
+    throw new Error('Post not found in queue');
+  }
+
+  // Create synthetic MatchedPostWithScore
+  const skippedMatch: MatchedPostWithScore = {
+    post,
+    score: 0,
+    matchedKeywords: [],
+    matchReason: 'Skipped before AI analysis',
+    matchedAt: Date.now(),
+    status: 'skipped',
+    skippedBeforeAnalysis: true,
+  };
+
+  // Add to matchedPostsWithScore
+  const matchedPosts = await getMatchedPostsWithScore();
+  matchedPosts.push(skippedMatch);
+  await saveMatchedPostsWithScore(matchedPosts);
+
+  // Add to evaluatedPostIds so it doesn't show in queue
+  const key = `${platform}:${postId}`;
+  await addEvaluatedPostIds([key]);
+}
+
 // ============================================================
 // Export storage object
 // ============================================================
@@ -636,6 +674,8 @@ export const storage = {
   saveMatchedPostsWithScore,
   updateMatchedPostStatus,
   clearMatchedPostsWithScore,
+  // Skip queued post
+  skipQueuedPost,
   // Evaluated post IDs
   getEvaluatedPostIds,
   saveEvaluatedPostIds,

src/shared/types.ts

@@ -209,6 +209,8 @@ export interface MatchedPostWithScore {
   draftReply?: string;
   /** Heat check result (tone/sentiment analysis) */
   heatCheck?: HeatCheckResult;
+  /** Flag indicating post was skipped before AI analysis */
+  skippedBeforeAnalysis?: boolean;
 }
 
 /**

src/sidepanel/components/PostCard.vue

@@ -173,6 +173,12 @@ const hiddenSuggestionsCount = computed(() => {
         <span class="rounded-full px-2 py-0.5 text-xs font-medium" :class="statusBadge.class">
           {{ statusBadge.text }}
         </span>
+        <span
+          v-if="match.skippedBeforeAnalysis"
+          class="rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-500"
+        >
+          Pre-Skipped
+        </span>
       </div>
       <div class="flex items-center gap-1.5">
         <!-- Heat Check Badge -->

src/sidepanel/components/QueuedPostCard.vue

@@ -10,6 +10,7 @@ const props = defineProps<{
 const emit = defineEmits<{
   (e: 'open', postId: string, platform: string): void;
   (e: 'jumpToPost', postId: string, platform: string): void;
+  (e: 'skip', postId: string, platform: string): void;
 }>();
 
 const isJumping = ref(false);
@@ -53,6 +54,10 @@ function handleJumpToPost() {
     isJumping.value = false;
   }, 1500);
 }
+
+function handleSkip() {
+  emit('skip', props.post.id, props.post.platform);
+}
 </script>
 
 <template>
@@ -98,6 +103,14 @@ function handleJumpToPost() {
 
     <!-- Footer -->
     <div class="flex items-center justify-end gap-2 border-t border-gray-100 pt-3">
+      <button
+        type="button"
+        class="rounded px-2 py-1 text-xs text-gray-500 hover:bg-gray-100"
+        title="Skip this post"
+        @click="handleSkip"
+      >
+        Skip
+      </button>
       <button
         type="button"
         class="flex items-center gap-1 rounded px-2 py-1 text-xs text-gray-500 hover:bg-gray-100"

src/sidepanel/views/MainView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref, computed } from 'vue';
 import { useAppState } from '../composables/useAppState';
 import { usePosts, type PostFilter } from '../composables/usePosts';
 import { useConfig } from '../composables/useConfig';
@@ -43,6 +43,14 @@ const {
   maxQueueSize,
 } = usePosts();
 
+// Extension version from manifest
+const extensionVersion = computed(() => {
+  if (typeof chrome !== 'undefined' && chrome.runtime?.getManifest) {
+    return chrome.runtime.getManifest().version;
+  }
+  return '';
+});
+
 // AI matching state (includes heat check)
 const isAIMatching = ref(false);
 const aiMatchError = ref<string | null>(null);
@@ -241,6 +249,28 @@ function handleOpenQueued(postId: string, platform: string) {
   }
 }
 
+// Handle skip queued post - sends message to background to skip before AI analysis
+async function handleSkipQueued(postId: string, platform: string) {
+  try {
+    const response = (await sendMessage({
+      type: 'SKIP_QUEUED_POST',
+      postId,
+      platform,
+    } as never)) as MessageResponse;
+
+    if (!response.success) {
+      throw new Error(response.error ?? 'Failed to skip post');
+    }
+
+    // Reload posts to reflect the change
+    await loadPosts();
+    toast.success('Post skipped');
+  } catch (error) {
+    console.error('Failed to skip queued post:', error);
+    toast.error('Failed to skip post');
+  }
+}
+
 // Handle jump to queued post - sends message to content script to scroll to the post
 async function handleJumpToQueuedPost(postId: string, _platform: string) {
   try {
@@ -343,7 +373,10 @@ async function handleJumpToPost(postId: string, _platform: string) {
 
       <!-- Header -->
       <div class="mb-4 flex items-center justify-between">
-        <h1 class="text-xl font-bold text-gray-900">ReplyQueue</h1>
+        <div class="flex items-baseline gap-2">
+          <h1 class="text-xl font-bold text-gray-900">ReplyQueue</h1>
+          <span v-if="extensionVersion" class="text-xs text-gray-400">v{{ extensionVersion }}</span>
+        </div>
         <div class="flex items-center gap-2">
           <TabStatusBadge :is-active="isActiveOnPlatform" :platform="currentPlatform" />
           <button
@@ -577,6 +610,7 @@ async function handleJumpToPost(postId: string, _platform: string) {
           :post="post"
           @open="handleOpenQueued"
           @jump-to-post="handleJumpToQueuedPost"
+          @skip="handleSkipQueued"
         />
       </div>