diff --git a/src/modules/nostr-feed/LINK_AGGREGATOR_PLAN.md b/src/modules/nostr-feed/LINK_AGGREGATOR_PLAN.md index a171006..9f91aff 100644 --- a/src/modules/nostr-feed/LINK_AGGREGATOR_PLAN.md +++ b/src/modules/nostr-feed/LINK_AGGREGATOR_PLAN.md @@ -108,8 +108,8 @@ Transform the nostr-feed module into a Reddit-style link aggregator with support - [x] Create `SubmissionComment.vue` - Recursive threaded comments - [x] Create `SubmissionDetailPage.vue` - Route page wrapper - [x] Add route `/submission/:id` for detail view -- [ ] Add comment sorting (pending) -- [ ] Integrate comment submission (pending) +- [x] Add comment sorting (best, new, old, controversial) +- [x] Integrate comment submission via SubmissionService.createComment() ### Phase 5: Communities (Future) - [ ] Create `CommunityService.ts` diff --git a/src/modules/nostr-feed/components/SubmissionDetail.vue b/src/modules/nostr-feed/components/SubmissionDetail.vue index 25a18c4..4040c0e 100644 --- a/src/modules/nostr-feed/components/SubmissionDetail.vue +++ b/src/modules/nostr-feed/components/SubmissionDetail.vue @@ -29,6 +29,7 @@ import SubmissionCommentComponent from './SubmissionComment.vue' import { useSubmission, useSubmissions } from '../composables/useSubmissions' import { tryInjectService, SERVICE_TOKENS } from '@/core/di-container' import type { ProfileService } from '../services/ProfileService' +import type { SubmissionService } from '../services/SubmissionService' import type { SubmissionWithMeta, SubmissionComment as SubmissionCommentType, @@ -45,9 +46,13 @@ interface Props { const props = defineProps() const router = useRouter() +// Comment sort options +type CommentSort = 'best' | 'new' | 'old' | 'controversial' + // Inject services const profileService = tryInjectService(SERVICE_TOKENS.PROFILE_SERVICE) const authService = tryInjectService(SERVICE_TOKENS.AUTH_SERVICE) +const submissionService = tryInjectService(SERVICE_TOKENS.SUBMISSION_SERVICE) // Use submission composable const { submission, comments, upvote, downvote } = useSubmission(props.submissionId) @@ -60,10 +65,22 @@ const showComposer = ref(false) const replyingTo = ref<{ id: string; author: string } | null>(null) const commentText = ref('') const isSubmittingComment = ref(false) +const commentError = ref(null) + +// Comment sorting state +const commentSort = ref('best') // Collapsed comments state const collapsedComments = ref(new Set()) +// Sorted comments +const sortedComments = computed(() => { + if (submissionService) { + return submissionService.getSortedComments(props.submissionId, commentSort.value) + } + return comments.value +}) + // Auth state const isAuthenticated = computed(() => authService?.isAuthenticated?.value || false) const currentUserPubkey = computed(() => authService?.user?.value?.pubkey || null) @@ -154,18 +171,21 @@ function cancelReply() { } async function submitComment() { - if (!commentText.value.trim() || !isAuthenticated.value) return + if (!commentText.value.trim() || !isAuthenticated.value || !submissionService) return isSubmittingComment.value = true + commentError.value = null + try { - // TODO: Implement comment submission via SubmissionService - console.log('Submit comment:', { - text: commentText.value, - parentId: replyingTo.value?.id || props.submissionId - }) + await submissionService.createComment( + props.submissionId, + commentText.value.trim(), + replyingTo.value?.id + ) cancelReply() - } catch (err) { + } catch (err: any) { console.error('Failed to submit comment:', err) + commentError.value = err.message || 'Failed to post comment' } finally { isSubmittingComment.value = false } @@ -415,6 +435,10 @@ onMounted(() => { class="flex-1 px-3 py-2 text-sm border rounded-lg bg-background resize-none focus:outline-none focus:ring-2 focus:ring-primary" /> + +
+ {{ commentError }} +